@idraw/util 0.3.1 → 0.4.0-alpha.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/index.d.ts +26 -71
- package/dist/esm/index.js +26 -29
- package/dist/esm/lib/canvas.d.ts +15 -0
- package/dist/esm/lib/canvas.js +36 -0
- package/dist/esm/lib/check.d.ts +8 -8
- package/dist/esm/lib/check.js +32 -33
- package/dist/esm/lib/color.d.ts +1 -0
- package/dist/esm/lib/color.js +152 -1
- package/dist/esm/lib/context2d.d.ts +75 -0
- package/dist/esm/lib/context2d.js +226 -0
- package/dist/esm/lib/controller.d.ts +6 -0
- package/dist/esm/lib/controller.js +99 -0
- package/dist/esm/lib/data.d.ts +5 -1
- package/dist/esm/lib/data.js +67 -2
- package/dist/esm/lib/element.d.ts +18 -0
- package/dist/esm/lib/element.js +241 -0
- package/dist/esm/lib/event.d.ts +9 -0
- package/dist/esm/lib/event.js +50 -0
- package/dist/esm/lib/html.d.ts +3 -0
- package/dist/esm/lib/html.js +170 -0
- package/dist/esm/lib/image.d.ts +4 -0
- package/dist/esm/lib/image.js +27 -0
- package/dist/esm/lib/is.d.ts +4 -2
- package/dist/esm/lib/is.js +34 -15
- package/dist/esm/lib/istype.d.ts +1 -2
- package/dist/esm/lib/istype.js +3 -4
- package/dist/esm/lib/{loader.js → load.js} +2 -2
- package/dist/esm/lib/middleware.d.ts +3 -0
- package/dist/esm/lib/middleware.js +22 -0
- package/dist/esm/lib/number.d.ts +3 -0
- package/dist/esm/lib/number.js +4 -0
- package/dist/esm/lib/parser.js +4 -1
- package/dist/esm/lib/point.d.ts +8 -0
- package/dist/esm/lib/point.js +30 -0
- package/dist/esm/lib/rect.d.ts +2 -0
- package/dist/esm/lib/rect.js +11 -0
- package/dist/esm/lib/rotate.d.ts +13 -0
- package/dist/esm/lib/rotate.js +205 -0
- package/dist/esm/lib/store.d.ts +12 -0
- package/dist/esm/lib/store.js +22 -0
- package/dist/esm/lib/svg-path.d.ts +10 -0
- package/dist/esm/lib/svg-path.js +36 -0
- package/dist/esm/lib/uuid.d.ts +2 -0
- package/dist/esm/lib/uuid.js +27 -2
- package/dist/esm/lib/vertex.d.ts +10 -0
- package/dist/esm/lib/vertex.js +73 -0
- package/dist/esm/lib/view-calc.d.ts +49 -0
- package/dist/esm/lib/view-calc.js +167 -0
- package/dist/index.global.js +1706 -330
- package/dist/index.global.min.js +1 -1
- package/package.json +4 -4
- package/LICENSE +0 -21
- package/dist/esm/lib/context.d.ts +0 -80
- package/dist/esm/lib/context.js +0 -194
- /package/dist/esm/lib/{loader.d.ts → load.d.ts} +0 -0
package/dist/index.global.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
var iDrawUtil=function(t){"use strict";function e(t){return function(e,o){return function i(r){let n=t[r];r===t.length&&o&&(n=o);if(!n)return Promise.resolve();try{return Promise.resolve(n(e,i.bind(null,r+1)))}catch(t){return Promise.reject(t)}}(0)}}function o(t){return new Promise((e=>{setTimeout((()=>{e()}),t)}))}function i(t,e){let o=-1;return function(...i){o>0||(o=setTimeout((()=>{t(...i),o=-1}),e))}}function r(t,e){const{filename:o,type:i="image/jpeg"}=e,r=t.toDataURL(i),n=document.createElement("a");n.href=r,n.download=o;const s=document.createEvent("MouseEvents");s.initEvent("click",!0,!1),n.dispatchEvent(s)}function n(t){return parseInt(t.replace(/^\#/,"0x"))}function s(t){return"#"+t.toString(16)}function c(t){return"string"==typeof t&&/^\#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t)}function h(){function t(){return(65536*(1+Math.random())|0).toString(16).substring(1)}return`${t()}${t()}-${t()}-${t()}-${t()}-${t()}${t()}${t()}`}function l(t){return function t(e){const o=(i=e,Object.prototype.toString.call(i).replace(/[\]|\[]{1,1}/gi,"").split(" ")[1]);var i;if(["Null","Number","String","Boolean","Undefined"].indexOf(o)>=0)return e;if("Array"===o){const o=[];return e.forEach((e=>{o.push(t(e))})),o}if("Object"===o){const o={};return Object.keys(e).forEach((i=>{o[i]=t(e[i])})),o}}(t)}function a(t){return(Object.prototype.toString.call(t)||"").replace(/(\[object|\])/gi,"").trim()}const u={type(t,e){const o=a(t);return!0===e?o.toLocaleLowerCase():o},array:t=>"Array"===a(t),json:t=>"Object"===a(t),function:t=>"Function"===a(t),asyncFunction:t=>"AsyncFunction"===a(t),string:t=>"String"===a(t),number:t=>"Number"===a(t),undefined:t=>"Undefined"===a(t),null:t=>"Null"===a(t),promise:t=>"Promise"===a(t)};const{Image:d}=window;function f(t){return new Promise(((e,o)=>{const i=new d;i.crossOrigin="anonymous",i.onload=function(){e(i)},i.onabort=o,i.onerror=o,i.src=t}))}async function _(t){const e=await function(t){return new Promise(((e,o)=>{const i=new Blob([t],{type:"image/svg+xml;charset=utf-8"}),r=new FileReader;r.readAsDataURL(i),r.onload=function(t){var o;const i=null==(o=null==t?void 0:t.target)?void 0:o.result;e(i)},r.onerror=function(t){o(t)}}))}(t);return await f(e)}async function g(t,e){t=t.replace(/\&/gi,"&");const o=await function(t,e){const{width:o,height:i}=e;return new Promise(((e,r)=>{const n=new Blob([`\n <svg xmlns="http://www.w3.org/2000/svg" width="${o||""}" height = "${i||""}">\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(n),s.onload=function(t){var o;const i=null==(o=null==t?void 0:t.target)?void 0:o.result;e(i)},s.onerror=function(t){r(t)}}))}(t,e);return await f(o)}class S{constructor(t,e){this._opts=e,this._ctx=t,this._transform={scale:1,scrollX:0,scrollY:0}}getContext(){return this._ctx}resetSize(t){this._opts={...this._opts,...t}}calcDeviceNum(t){return t*this._opts.devicePixelRatio}calcScreenNum(t){return t/this._opts.devicePixelRatio}getSize(){return{width:this._opts.width,height:this._opts.height,contextWidth:this._opts.contextWidth,contextHeight:this._opts.contextHeight,devicePixelRatio:this._opts.devicePixelRatio}}setTransform(t){this._transform={...this._transform,...t}}getTransform(){return{scale:this._transform.scale,scrollX:this._transform.scrollX,scrollY:this._transform.scrollY}}setFillStyle(t){this._ctx.fillStyle=t}fill(t){return this._ctx.fill(t||"nonzero")}arc(t,e,o,i,r,n){return this._ctx.arc(this._doSize(t),this._doSize(e),this._doSize(o),i,r,n)}rect(t,e,o,i){return this._ctx.rect(this._doSize(t),this._doSize(e),this._doSize(o),this._doSize(i))}fillRect(t,e,o,i){return this._ctx.fillRect(this._doSize(t),this._doSize(e),this._doSize(o),this._doSize(i))}clearRect(t,e,o,i){return this._ctx.clearRect(this._doSize(t),this._doSize(e),this._doSize(o),this._doSize(i))}beginPath(){return this._ctx.beginPath()}closePath(){return this._ctx.closePath()}lineTo(t,e){return this._ctx.lineTo(this._doSize(t),this._doSize(e))}moveTo(t,e){return this._ctx.moveTo(this._doSize(t),this._doSize(e))}arcTo(t,e,o,i,r){return this._ctx.arcTo(this._doSize(t),this._doSize(e),this._doSize(o),this._doSize(i),this._doSize(r))}setLineWidth(t){return this._ctx.lineWidth=this._doSize(t)}setLineDash(t){return this._ctx.setLineDash(t.map((t=>this._doSize(t))))}isPointInPath(t,e){return this._ctx.isPointInPath(this._doX(t),this._doY(e))}isPointInPathWithoutScroll(t,e){return this._ctx.isPointInPath(this._doSize(t),this._doSize(e))}setStrokeStyle(t){this._ctx.strokeStyle=t}stroke(){return this._ctx.stroke()}translate(t,e){return this._ctx.translate(this._doSize(t),this._doSize(e))}rotate(t){return this._ctx.rotate(t)}drawImage(...t){const e=t[0],o=t[1],i=t[2],r=t[3],n=t[4],s=t[t.length-4],c=t[t.length-3],h=t[t.length-2],l=t[t.length-1];return 9===t.length?this._ctx.drawImage(e,this._doSize(o),this._doSize(i),this._doSize(r),this._doSize(n),this._doSize(s),this._doSize(c),this._doSize(h),this._doSize(l)):this._ctx.drawImage(e,this._doSize(s),this._doSize(c),this._doSize(h),this._doSize(l))}createPattern(t,e){return this._ctx.createPattern(t,e)}measureText(t){return this._ctx.measureText(t)}setTextAlign(t){this._ctx.textAlign=t}fillText(t,e,o,i){return void 0!==i?this._ctx.fillText(t,this._doSize(e),this._doSize(o),this._doSize(i)):this._ctx.fillText(t,this._doSize(e),this._doSize(o))}strokeText(t,e,o,i){return void 0!==i?this._ctx.strokeText(t,this._doSize(e),this._doSize(o),this._doSize(i)):this._ctx.strokeText(t,this._doSize(e),this._doSize(o))}setFont(t){const 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(" ")}`}setTextBaseline(t){this._ctx.textBaseline=t}setGlobalAlpha(t){this._ctx.globalAlpha=t}save(){this._ctx.save()}restore(){this._ctx.restore()}scale(t,e){this._ctx.scale(t,e)}setShadowColor(t){this._ctx.shadowColor=t}setShadowOffsetX(t){this._ctx.shadowOffsetX=this._doSize(t)}setShadowOffsetY(t){this._ctx.shadowOffsetY=this._doSize(t)}setShadowBlur(t){this._ctx.shadowBlur=this._doSize(t)}ellipse(t,e,o,i,r,n,s,c){this._ctx.ellipse(this._doSize(t),this._doSize(e),this._doSize(o),this._doSize(i),r,n,s,c)}_doSize(t){return this._opts.devicePixelRatio*t}_doX(t){const{scale:e,scrollX:o}=this._transform,i=(t-o)/e;return this._doSize(i)}_doY(t){const{scale:e,scrollY:o}=this._transform,i=(t-o)/e;return this._doSize(i)}}function m(t){return"number"==typeof t&&(t>0||t<=0)}function x(t){return"number"==typeof t&&t>=0}function p(t){return"string"==typeof t&&/^(http:\/\/|https:\/\/|\.\/|\/)/.test(`${t}`)}function z(t){return"string"==typeof t&&/^(data:image\/)/.test(`${t}`)}const w={x:function(t){return m(t)},y:function(t){return m(t)},w:x,h:function(t){return"number"==typeof t&&t>=0},angle:function(t){return"number"==typeof t&&t>=-360&&t<=360},number:m,borderWidth:function(t){return x(t)},borderRadius:function(t){return m(t)&&t>=0},color:function(t){return c(t)},imageSrc:function(t){return z(t)||p(t)},imageURL:p,imageBase64:z,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){let e=!1;if("string"==typeof t){let 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 m(t)&&t>0},lineHeight:function(t){return m(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 m(t)&&t>0}};function y(t={}){const{borderColor:e,borderRadius:o,borderWidth:i}=t;return!(t.hasOwnProperty("borderColor")&&!w.color(e))&&(!(t.hasOwnProperty("borderRadius")&&!w.number(o))&&!(t.hasOwnProperty("borderWidth")&&!w.number(i)))}const b={attrs:function(t){const{x:e,y:o,w:i,h:r,angle:n}=t;return!!(w.x(e)&&w.y(o)&&w.w(i)&&w.h(r)&&w.angle(n))&&(n>=-360&&n<=360)},textDesc:function(t){const{text:e,color:o,fontSize:i,lineHeight:r,fontFamily:n,textAlign:s,fontWeight:c,bgColor:h,strokeWidth:l,strokeColor:a}=t;return!!w.text(e)&&(!!w.color(o)&&(!!w.fontSize(i)&&(!(t.hasOwnProperty("bgColor")&&!w.color(h))&&(!(t.hasOwnProperty("fontWeight")&&!w.fontWeight(c))&&(!(t.hasOwnProperty("lineHeight")&&!w.lineHeight(r))&&(!(t.hasOwnProperty("fontFamily")&&!w.fontFamily(n))&&(!(t.hasOwnProperty("textAlign")&&!w.textAlign(s))&&(!(t.hasOwnProperty("strokeWidth")&&!w.strokeWidth(l))&&(!(t.hasOwnProperty("strokeColor")&&!w.color(a))&&!!y(t))))))))))},rectDesc:function(t){const{bgColor:e}=t;return!(t.hasOwnProperty("bgColor")&&!w.color(e))&&!!y(t)},circleDesc:function(t){const{bgColor:e,borderColor:o,borderWidth:i}=t;return!(t.hasOwnProperty("bgColor")&&!w.color(e))&&(!(t.hasOwnProperty("borderColor")&&!w.color(o))&&!(t.hasOwnProperty("borderWidth")&&!w.number(i)))},imageDesc:function(t){const{src:e}=t;return!!w.imageSrc(e)},svgDesc:function(t){const{svg:e}=t;return!!w.svg(e)},htmlDesc:function(t){const{html:e}=t;return!!w.html(e)}},v={is:w,check:b,delay:o,compose:e,throttle:i,loadImage:f,loadSVG:_,loadHTML:g,downloadImageFromCanvas:r,toColorHexStr:s,toColorHexNum:n,isColorStr:c,createUUID:h,istype:u,deepClone:l,Context:S};return t.Context=S,t.check=b,t.compose=e,t.createUUID=h,t.deepClone=l,t.default=v,t.delay=o,t.downloadImageFromCanvas=r,t.is=w,t.isColorStr=c,t.istype=u,t.loadHTML=g,t.loadImage=f,t.loadSVG=_,t.throttle=i,t.toColorHexNum=n,t.toColorHexStr=s,Object.defineProperties(t,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}}),t}({});
|
|
1
|
+
var iDrawUtil=function(t){"use strict";function e(t){return"string"==typeof t&&(/^\#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t)||/^[a-z]{1,}$/i.test(t))}const n={aliceblue:"#f0f8ff",antiquewhite:"#faebd7",aqua:"#00ffff",aquamarine:"#7fffd4",azure:"#f0ffff",beige:"#f5f5dc",bisque:"#ffe4c4",black:"#000000",blanchedalmond:"#ffebcd",blue:"#0000ff",blueviolet:"#8a2be2",brown:"#a52a2a",burlywood:"#deb887",cadetblue:"#5f9ea0",chartreuse:"#7fff00",chocolate:"#d2691e",coral:"#ff7f50",cornflowerblue:"#6495ed",cornsilk:"#fff8dc",crimson:"#dc143c",cyan:"#00ffff",darkblue:"#00008b",darkcyan:"#008b8b",darkgoldenrod:"#b8860b",darkgray:"#a9a9a9",darkgreen:"#006400",darkkhaki:"#bdb76b",darkmagenta:"#8b008b",darkolivegreen:"#556b2f",darkorange:"#ff8c00",darkorchid:"#9932cc",darkred:"#8b0000",darksalmon:"#e9967a",darkseagreen:"#8fbc8f",darkslateblue:"#483d8b",darkslategray:"#2f4f4f",darkturquoise:"#00ced1",darkviolet:"#9400d3",deeppink:"#ff1493",deepskyblue:"#00bfff",dimgray:"#696969",dodgerblue:"#1e90ff",firebrick:"#b22222",floralwhite:"#fffaf0",forestgreen:"#228b22",fuchsia:"#ff00ff",gainsboro:"#dcdcdc",ghostwhite:"#f8f8ff",gold:"#ffd700",goldenrod:"#daa520",gray:"#808080",green:"#008000",greenyellow:"#adff2f",honeydew:"#f0fff0",hotpink:"#ff69b4","indianred ":"#cd5c5c",indigo:"#4b0082",ivory:"#fffff0",khaki:"#f0e68c",lavender:"#e6e6fa",lavenderblush:"#fff0f5",lawngreen:"#7cfc00",lemonchiffon:"#fffacd",lightblue:"#add8e6",lightcoral:"#f08080",lightcyan:"#e0ffff",lightgoldenrodyellow:"#fafad2",lightgrey:"#d3d3d3",lightgreen:"#90ee90",lightpink:"#ffb6c1",lightsalmon:"#ffa07a",lightseagreen:"#20b2aa",lightskyblue:"#87cefa",lightslategray:"#778899",lightsteelblue:"#b0c4de",lightyellow:"#ffffe0",lime:"#00ff00",limegreen:"#32cd32",linen:"#faf0e6",magenta:"#ff00ff",maroon:"#800000",mediumaquamarine:"#66cdaa",mediumblue:"#0000cd",mediumorchid:"#ba55d3",mediumpurple:"#9370d8",mediumseagreen:"#3cb371",mediumslateblue:"#7b68ee",mediumspringgreen:"#00fa9a",mediumturquoise:"#48d1cc",mediumvioletred:"#c71585",midnightblue:"#191970",mintcream:"#f5fffa",mistyrose:"#ffe4e1",moccasin:"#ffe4b5",navajowhite:"#ffdead",navy:"#000080",oldlace:"#fdf5e6",olive:"#808000",olivedrab:"#6b8e23",orange:"#ffa500",orangered:"#ff4500",orchid:"#da70d6",palegoldenrod:"#eee8aa",palegreen:"#98fb98",paleturquoise:"#afeeee",palevioletred:"#d87093",papayawhip:"#ffefd5",peachpuff:"#ffdab9",peru:"#cd853f",pink:"#ffc0cb",plum:"#dda0dd",powderblue:"#b0e0e6",purple:"#800080",rebeccapurple:"#663399",red:"#ff0000",rosybrown:"#bc8f8f",royalblue:"#4169e1",saddlebrown:"#8b4513",salmon:"#fa8072",sandybrown:"#f4a460",seagreen:"#2e8b57",seashell:"#fff5ee",sienna:"#a0522d",silver:"#c0c0c0",skyblue:"#87ceeb",slateblue:"#6a5acd",slategray:"#708090",snow:"#fffafa",springgreen:"#00ff7f",steelblue:"#4682b4",tan:"#d2b48c",teal:"#008080",thistle:"#d8bfd8",tomato:"#ff6347",turquoise:"#40e0d0",violet:"#ee82ee",wheat:"#f5deb3",white:"#ffffff",whitesmoke:"#f5f5f5",yellow:"#ffff00",yellowgreen:"#9acd32"};function i(){function t(){return(65536*(1+Math.random())|0).toString(16).substring(1)}return`${t()}${t()}-${t()}-${t()}-${t()}-${t()}${t()}${t()}`}function o(t){let e=0;for(let n=0;n<t.length;n++)e+=t.charCodeAt(n)*t.charCodeAt(n)*n*n;return e.toString(16).substring(0,4)}function r(t){const e=t.length,n=Math.floor(e/2),i=t.substring(0,4).padEnd(4,"0"),r=t.substring(0,4).padEnd(4,"0");return`@assets/${o(e.toString(16).padEnd(4,i))}${o(t.substring(n-4,n).padEnd(4,i)).padEnd(4,"f")}-${o(t.substring(n-8,n-4).padEnd(4,i)).padEnd(4,"f")}-${o(t.substring(n-12,n-8).padEnd(4,i)).padEnd(4,"f")}-${o(t.substring(n-16,n-12).padEnd(4,r)).padEnd(4,"f")}-${o(t.substring(n,n+4).padEnd(4,r)).padEnd(4,"f")}${o(t.substring(n+4,n+8).padEnd(4,r)).padEnd(4,"f")}${o(r.padEnd(4,i).padEnd(4,r))}`}function a(t){return/^@assets\/[0-9a-z]{8,8}\-[0-9a-z]{4,4}\-[0-9a-z]{4,4}\-[0-9a-z]{4,4}\-[0-9a-z]{12,12}$/.test(`${t}`)}function s(t){return function t(e){const n=function(t){return Object.prototype.toString.call(t).replace(/[\]|\[]{1,1}/gi,"").split(" ")[1]}(e);if(["Null","Number","String","Boolean","Undefined"].indexOf(n)>=0)return e;if("Array"===n){const n=[];return e.forEach((e=>{n.push(t(e))})),n}if("Object"===n){const n={};Object.keys(e).forEach((i=>{n[i]=t(e[i])}));return Object.getOwnPropertySymbols(e).forEach((i=>{n[i]=t(e[i])})),n}}(t)}function l(t){return(Object.prototype.toString.call(t)||"").replace(/(\[object|\])/gi,"").trim()}const c={type(t,e){const n=l(t);return!0===e?n.toLocaleLowerCase():n},array:t=>"Array"===l(t),json:t=>"Object"===l(t),function:t=>"Function"===l(t),asyncFunction:t=>"AsyncFunction"===l(t),string:t=>"String"===l(t),number:t=>"Number"===l(t),undefined:t=>"Undefined"===l(t),null:t=>"Null"===l(t),promise:t=>"Promise"===l(t)};const{Image:u}=window;function h(t){return new Promise(((e,n)=>{const i=new u;i.crossOrigin="anonymous",i.onload=function(){e(i)},i.onabort=n,i.onerror=n,i.src=t}))}function f(t){return"number"==typeof t&&(t>0||t<=0)}function d(t){return"number"==typeof t&&t>=0}function x(t){return"string"==typeof t&&/^(http:\/\/|https:\/\/|\.\/|\/)/.test(`${t}`)}function g(t){return"string"==typeof t&&/^(data:image\/)/.test(`${t}`)}const m={x:function(t){return f(t)},y:function(t){return f(t)},w:d,h:function(t){return"number"==typeof t&&t>=0},angle:function(t){return"number"==typeof t&&t>=-360&&t<=360},number:f,numberStr:function(t){return/^(-?\d+(?:\.\d+)?)$/.test(`${t}`)},borderWidth:function(t){return d(t)},borderRadius:function(t){return f(t)&&t>=0},color:function(t){return e(t)},imageSrc:function(t){return g(t)||x(t)},imageURL:x,imageBase64:g,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){let e=!1;if("string"==typeof t){let n=document.createElement("div");n.innerHTML=t,n.children.length>0&&(e=!0),n=null}return e},text:function(t){return"string"==typeof t},fontSize:function(t){return f(t)&&t>0},lineHeight:function(t){return f(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 f(t)&&t>0}};function y(t={}){const{borderColor:e,borderRadius:n,borderWidth:i}=t;return!(t.hasOwnProperty("borderColor")&&!m.color(e))&&(!(t.hasOwnProperty("borderRadius")&&!m.number(n))&&!(t.hasOwnProperty("borderWidth")&&!m.number(i)))}const p={attrs:function(t){const{x:e,y:n,w:i,h:o,angle:r}=t;return!!(m.x(e)&&m.y(n)&&m.w(i)&&m.h(o)&&m.angle(r))&&(r>=-360&&r<=360)},textDesc:function(t){const{text:e,color:n,fontSize:i,lineHeight:o,fontFamily:r,textAlign:a,fontWeight:s,background:l,strokeWidth:c,strokeColor:u}=t;return!!m.text(e)&&(!!m.color(n)&&(!!m.fontSize(i)&&(!(t.hasOwnProperty("background")&&!m.color(l))&&(!(t.hasOwnProperty("fontWeight")&&!m.fontWeight(s))&&(!(t.hasOwnProperty("lineHeight")&&!m.lineHeight(o))&&(!(t.hasOwnProperty("fontFamily")&&!m.fontFamily(r))&&(!(t.hasOwnProperty("textAlign")&&!m.textAlign(a))&&(!(t.hasOwnProperty("strokeWidth")&&!m.strokeWidth(c))&&(!(t.hasOwnProperty("strokeColor")&&!m.color(u))&&!!y(t))))))))))},rectDesc:function(t){const{background:e}=t;return!(t.hasOwnProperty("background")&&!m.color(e))&&!!y(t)},circleDesc:function(t){const{background:e,borderColor:n,borderWidth:i}=t;return!(t.hasOwnProperty("background")&&!m.color(e))&&(!(t.hasOwnProperty("borderColor")&&!m.color(n))&&!(t.hasOwnProperty("borderWidth")&&!m.number(i)))},imageDesc:function(t){const{src:e}=t;return!!m.imageSrc(e)},svgDesc:function(t){const{svg:e}=t;return!!m.svg(e)},htmlDesc:function(t){const{html:e}=t;return!!m.html(e)}};class v{constructor(t,e){this._devicePixelRatio=1;const{devicePixelRatio:n=1}=e;this._ctx=t,this._devicePixelRatio=n}$undoPixelRatio(t){return t/this._devicePixelRatio}$doPixelRatio(t){return this._devicePixelRatio*t}$getContext(){return this._ctx}$setFont(t){const e=[];t.fontWeight&&e.push(`${t.fontWeight}`),e.push(`${this.$doPixelRatio(t.fontSize||12)}px`),e.push(`${t.fontFamily||"sans-serif"}`),this._ctx.font=`${e.join(" ")}`}$resize(t){const{width:e,height:n,devicePixelRatio:i}=t,{canvas:o}=this._ctx;o.width=e*i,o.height=n*i,this._devicePixelRatio=i}get canvas(){return this._ctx.canvas}get fillStyle(){return this._ctx.fillStyle}set fillStyle(t){this._ctx.fillStyle=t}get strokeStyle(){return this._ctx.strokeStyle}set strokeStyle(t){this._ctx.strokeStyle=t}get lineWidth(){return this.$undoPixelRatio(this._ctx.lineWidth)}set lineWidth(t){this._ctx.lineWidth=this.$doPixelRatio(t)}get textAlign(){return this._ctx.textAlign}set textAlign(t){this._ctx.textAlign=t}get textBaseline(){return this._ctx.textBaseline}set textBaseline(t){this._ctx.textBaseline=t}get globalAlpha(){return this._ctx.globalAlpha}set globalAlpha(t){this._ctx.globalAlpha=t}get shadowColor(){return this._ctx.shadowColor}set shadowColor(t){this._ctx.shadowColor=t}get shadowOffsetX(){return this.$undoPixelRatio(this._ctx.shadowOffsetX)}set shadowOffsetX(t){this._ctx.shadowOffsetX=this.$doPixelRatio(t)}get shadowOffsetY(){return this.$undoPixelRatio(this._ctx.shadowOffsetY)}set shadowOffsetY(t){this._ctx.shadowOffsetY=this.$doPixelRatio(t)}get shadowBlur(){return this.$undoPixelRatio(this._ctx.shadowBlur)}set shadowBlur(t){this._ctx.shadowBlur=this.$doPixelRatio(t)}get lineCap(){return this._ctx.lineCap}set lineCap(t){this._ctx.lineCap=t}get globalCompositeOperation(){return this._ctx.globalCompositeOperation}set globalCompositeOperation(t){this._ctx.globalCompositeOperation=t}fill(...t){return this._ctx.fill(...t)}arc(t,e,n,i,o,r){return this._ctx.arc(this.$doPixelRatio(t),this.$doPixelRatio(e),this.$doPixelRatio(n),i,o,r)}rect(t,e,n,i){return this._ctx.rect(this.$doPixelRatio(t),this.$doPixelRatio(e),this.$doPixelRatio(n),this.$doPixelRatio(i))}fillRect(t,e,n,i){return this._ctx.fillRect(this.$doPixelRatio(t),this.$doPixelRatio(e),this.$doPixelRatio(n),this.$doPixelRatio(i))}clearRect(t,e,n,i){return this._ctx.clearRect(this.$doPixelRatio(t),this.$doPixelRatio(e),this.$doPixelRatio(n),this.$doPixelRatio(i))}beginPath(){return this._ctx.beginPath()}closePath(){return this._ctx.closePath()}lineTo(t,e){return this._ctx.lineTo(this.$doPixelRatio(t),this.$doPixelRatio(e))}moveTo(t,e){return this._ctx.moveTo(this.$doPixelRatio(t),this.$doPixelRatio(e))}arcTo(t,e,n,i,o){return this._ctx.arcTo(this.$doPixelRatio(t),this.$doPixelRatio(e),this.$doPixelRatio(n),this.$doPixelRatio(i),this.$doPixelRatio(o))}getLineDash(){return this._ctx.getLineDash()}setLineDash(t){return this._ctx.setLineDash(t.map((t=>this.$doPixelRatio(t))))}stroke(t){return t?this._ctx.stroke(t):this._ctx.stroke()}translate(t,e){return this._ctx.translate(this.$doPixelRatio(t),this.$doPixelRatio(e))}rotate(t){return this._ctx.rotate(t)}drawImage(...t){const e=t[0],n=t[1],i=t[2],o=t[3],r=t[4],a=t[t.length-4],s=t[t.length-3],l=t[t.length-2],c=t[t.length-1];return 9===t.length?this._ctx.drawImage(e,this.$doPixelRatio(n),this.$doPixelRatio(i),this.$doPixelRatio(o),this.$doPixelRatio(r),this.$doPixelRatio(a),this.$doPixelRatio(s),this.$doPixelRatio(l),this.$doPixelRatio(c)):this._ctx.drawImage(e,this.$doPixelRatio(a),this.$doPixelRatio(s),this.$doPixelRatio(l),this.$doPixelRatio(c))}createPattern(t,e){return this._ctx.createPattern(t,e)}measureText(t){return this._ctx.measureText(t)}fillText(t,e,n,i){return void 0!==i?this._ctx.fillText(t,this.$doPixelRatio(e),this.$doPixelRatio(n),this.$doPixelRatio(i)):this._ctx.fillText(t,this.$doPixelRatio(e),this.$doPixelRatio(n))}strokeText(t,e,n,i){return void 0!==i?this._ctx.strokeText(t,this.$doPixelRatio(e),this.$doPixelRatio(n),this.$doPixelRatio(i)):this._ctx.strokeText(t,this.$doPixelRatio(e),this.$doPixelRatio(n))}save(){this._ctx.save()}restore(){this._ctx.restore()}scale(t,e){this._ctx.scale(t,e)}circle(t,e,n,i,o,r,a,s){this._ctx.ellipse(this.$doPixelRatio(t),this.$doPixelRatio(e),this.$doPixelRatio(n),this.$doPixelRatio(i),o,r,a,s)}isPointInPath(t,e){return this._ctx.isPointInPath(this.$doPixelRatio(t),this.$doPixelRatio(e))}clip(...t){return this._ctx.clip(...t)}setTransform(t,e,n,i,o,r){return this._ctx.setTransform(t,e,n,i,o,r)}getTransform(){return this._ctx.getTransform()}createLinearGradient(t,e,n,i){return this._ctx.createLinearGradient(this.$doPixelRatio(t),this.$doPixelRatio(e),this.$doPixelRatio(n),this.$doPixelRatio(i))}createRadialGradient(t,e,n,i,o,r){return this._ctx.createRadialGradient(this.$doPixelRatio(t),this.$doPixelRatio(e),this.$doPixelRatio(n),this.$doPixelRatio(i),this.$doPixelRatio(o),this.$doPixelRatio(r))}createConicGradient(t,e,n){return this._ctx.createConicGradient(t,this.$doPixelRatio(e),this.$doPixelRatio(n))}}function w(t){const{width:e,height:n,ctx:i,devicePixelRatio:o}=t;let r=i;if(!r){const t=document.createElement("canvas");t.width=e*o,t.height=n*o,r=t.getContext("2d")}return new v(r,t)}function b(t,e){const n=(t.x-e.x)*(t.x-e.x)+(t.y-e.y)*(t.y-e.y);return 0===n?n:Math.sqrt(n)}function P(t,e){return t.x===e.x&&t.y===e.y&&t.t===e.t}function $(t){return t>=0||t<0}function R(t){return $(t.x)&&$(t.y)&&t.t>0}function _(t,e){return{x:t.x+(e.x-t.x)/2,y:t.y+(e.y-t.y)/2}}function M(t){return t/180*Math.PI}function I(t){return{x:t.x+t.w/2,y:t.y+t.h/2}}function S(t){const e=Math.min(t[0].x,t[1].x,t[2].x,t[3].x),n=Math.min(t[0].y,t[1].y,t[2].y,t[3].y);return I({x:e,y:n,w:Math.max(t[0].x,t[1].x,t[2].x,t[3].x)-e,h:Math.max(t[0].y,t[1].y,t[2].y,t[3].y)-n})}function k(t,e,n){const i=function(t,e){const n=e.x-t.x,i=e.y-t.y;if(0===n){if(i<0)return 0;if(i>0)return Math.PI}else if(0===i){if(n<0)return 3*Math.PI/2;if(n>0)return Math.PI/2}return n>0&&i<0?Math.atan(Math.abs(n)/Math.abs(i)):n>0&&i>0?Math.PI-Math.atan(Math.abs(n)/Math.abs(i)):n<0&&i>0?Math.PI+Math.atan(Math.abs(n)/Math.abs(i)):n<0&&i<0?2*Math.PI-Math.atan(Math.abs(n)/Math.abs(i)):0}(t,e);let o=i+n;o>2*Math.PI?o-=2*Math.PI:o<0-2*Math.PI&&(o+=2*Math.PI),o<0&&(o+=2*Math.PI);const r=b(t,e);let a=0,s=0;return 0===o?(a=0,s=0-r):o>0&&o<Math.PI/2?(a=Math.sin(o)*r,s=0-Math.cos(o)*r):o===Math.PI/2?(a=r,s=0):o>Math.PI/2&&o<Math.PI?(a=Math.sin(Math.PI-o)*r,s=Math.cos(Math.PI-o)*r):o===Math.PI?(a=0,s=r):o>Math.PI&&o<1.5*Math.PI?(a=0-Math.sin(o-Math.PI)*r,s=Math.cos(o-Math.PI)*r):o===1.5*Math.PI?(a=0-r,s=0):o>1.5*Math.PI&&o<2*Math.PI?(a=0-Math.sin(2*Math.PI-o)*r,s=0-Math.cos(2*Math.PI-o)*r):o===2*Math.PI&&(a=0,s=0-r),a+=t.x,s+=t.y,{x:a,y:s}}function E(t,e,n){const{x:i,y:o,w:r,h:a}=t;let s={x:i,y:o},l={x:i+r,y:o},c={x:i+r,y:o+a},u={x:i,y:o+a};if(n&&(n>0||n<0)){const t=M(O(n));s=k(e,s,t),l=k(e,l,t),c=k(e,c,t),u=k(e,u,t)}return[s,l,c,u]}function A(t){const{angle:e=0}=t;return E(t,I(t),e)}function C(t,e,n){return[k(t,{x:e[0].x,y:e[0].y},n),k(t,{x:e[1].x,y:e[1].y},n),k(t,{x:e[2].x,y:e[2].y},n),k(t,{x:e[3].x,y:e[3].y},n)]}function O(t){if(!(t>0||t<0)||0===t)return 0;let e=t%360;return e<0&&(e+=360),e}function T(t,e){const n={x:0,y:0,w:0,h:0};t.forEach((t=>{const e={x:t.x,y:t.y,w:t.w,h:t.h,angle:t.angle};if(e.angle&&(e.angle>0||e.angle<0)){const t=A(e);if(4===t.length){const n=[t[0].x,t[1].x,t[2].x,t[3].x],i=[t[0].y,t[1].y,t[2].y,t[3].y];e.x=Math.min(...n),e.y=Math.min(...i),e.w=Math.abs(Math.max(...n)-Math.min(...n)),e.h=Math.abs(Math.max(...i)-Math.min(...i))}}const i=Math.min(e.x,n.x),o=Math.min(e.y,n.y),r=Math.max(e.x+e.w,n.x+n.w),a=Math.max(e.y+e.h,n.y+n.h);n.x=i,n.y=o,n.w=Math.abs(r-i),n.h=Math.abs(a-o)})),(null==e?void 0:e.extend)&&(n.x=Math.min(n.x,0),n.y=Math.min(n.y,0));const i={contextWidth:n.w,contextHeight:n.h};return(null==e?void 0:e.viewWidth)&&(null==e?void 0:e.viewHeight)&&(null==e?void 0:e.viewWidth)>0&&(null==e?void 0:e.viewHeight)>0&&(e.viewWidth>n.x+n.w&&(i.contextWidth=e.viewWidth-n.x),e.viewHeight>n.y+n.h&&(i.contextHeight=e.viewHeight-n.y)),i}function z(t,e){const n=Object.keys(e);for(let i=0;i<n.length;i++){const o=n[i];["x","y","w","h","angle","name"].includes(o)?t[o]=e[o]:["detail","operations"].includes(o)&&(istype.json(e[o])&&istype.json(t[o])||istype.array(e[o])&&istype.array(t[o]))&&(t[o]={...t[o],...e[o]})}return t}function W(t,e){const n=t.x,i=t.y,o=t.x+t.w,r=t.y+t.h,a=e.x,s=e.y,l=e.x+e.w,c=e.y+e.h;return n<=l&&o>=a&&i<=c&&r>=s}function L(t,e){const{viewScaleInfo:n}=e,{x:i,y:o,w:r,h:a,angle:s}=t,{scale:l,offsetTop:c,offsetLeft:u}=n;return{x:i*l+u,y:o*l+c,w:r*l,h:a*l,angle:s}}function V(t,e){const{viewScaleInfo:n}=e,{x:i,y:o}=t,{scale:r,offsetTop:a,offsetLeft:s}=n;return{x:i*r+s,y:o*r+a}}function D(t,e){const{context2d:n,element:i,viewScaleInfo:o,viewSizeInfo:r}=e,{angle:a=0}=i,{x:s,y:l,w:c,h:u}=L(i,{viewScaleInfo:o,viewSizeInfo:r}),h=A({x:s,y:l,w:c,h:u,angle:a});if(h.length>=2){n.beginPath(),n.moveTo(h[0].x,h[0].y);for(let t=1;t<h.length;t++)n.lineTo(h[t].x,h[t].y);n.closePath()}return!!n.isPointInPath(t.x,t.y)}function H(t){const{x:e,y:n,h:i,w:o}=t;return[{x:e,y:n},{x:e+o,y:n},{x:e+o,y:n+i},{x:e,y:n+i}]}function j(t){const{x:e,y:n,w:i,h:o,angle:r=0}=t;return 0===r?H(t):E(t,I({x:e,y:n,w:i,h:o,angle:r}),r)}function F(t){const e=[];let n=0,i=0;const o=[],r=[...t];for(let t=0;t<r.length;t++){const{x:a,y:s,w:l,h:c,angle:u=0}=r[t];let h;if(n+=a,i+=s,0===t){const t={x:n,y:i,w:l,h:c,angle:u};h=j({x:a,y:s,w:l,h:c,angle:u}),o.push({center:I(t),angle:u,radian:M(u)})}else{h=H({x:n,y:i,w:l,h:c,angle:u});for(let t=0;t<o.length;t++){const{center:e,radian:n}=o[t];h=C(e,h,n)}const t=S(h);if(u>0||u<0){h=C(t,h,M(u))}o.push({center:t,angle:u,radian:M(u)})}e.push(h)}return e}function B(t,e){const{groupQueue:n}=e;if(!(n.length>0))return[j(t)];return F([...n,t])}function q(t,e){return B(t,e).pop()||null}function G(t,e){const{x:n,y:i}=t,{size:o,angle:r}=e;return{x:n-o/2,y:i-o/2,w:o,h:o,angle:r}}const U=/([astvzqmhlc])([^astvzqmhlc]*)/gi,Q=/(-?\d+(?:\.\d+)?)/gi;const N=/\s([^'"/\s><]+?)[\s/>]|([^\s=]+)=\s?(".*?"|'.*?')/g,X=/<[a-zA-Z0-9\-\!\/](?:"[^"]*"|'[^']*'|[^'">])*>/g,Y=/^\s*$/,Z={};function J(t){const e={type:"element",name:"",isVoid:!1,attributes:{},children:[]},n=t.match(/<\/?([^\s]+?)[/\s>]/);if(n&&(e.name=n[1],(Z[n[1]]||"/"===t.charAt(t.length-2))&&(e.isVoid=!0),e.name.startsWith("!--"))){const e=t.indexOf("--\x3e");return{type:"comment",name:null,attributes:{},children:[],isVoid:!1,comment:-1!==e?t.slice(4,e):""}}const i=new RegExp(N);let o=null;for(;o=i.exec(t),null!==o;)if(o[0].trim())if(o[1]){const t=o[1].trim();let n=[t,""];t.indexOf("=")>-1&&(n=t.split("=")),e.attributes[n[0]]=n[1],i.lastIndex--}else o[2]&&(e.attributes[o[2]]=o[3].trim().substring(1,o[3].length-1));return e}function K(t,e){switch(e.type){case"text":return t+e.textContent;case"element":return t+="<"+e.name+(e.attributes?function(t){const e=[];for(let n in t)e.push(n+'="'+t[n]+'"');return e.length?" "+e.join(" "):""}(e.attributes):"")+(e.isVoid?"/>":">"),e.isVoid?t:t+e.children.reduce(K,"")+"</"+e.name+">";case"comment":return t+="\x3c!--"+e.comment+"--\x3e"}}return t.Context2D=v,t.EventEmitter=class{constructor(){this._listeners=new Map}on(t,e){if(this._listeners.has(t)){const n=this._listeners.get(t)||[];null==n||n.push(e),this._listeners.set(t,n)}else this._listeners.set(t,[e])}off(t,e){if(this._listeners.has(t)){const n=this._listeners.get(t);if(Array.isArray(n))for(let t=0;t<(null==n?void 0:n.length);t++)if(n[t]===e){n.splice(t,1);break}this._listeners.set(t,n||[])}}trigger(t,e){const n=this._listeners.get(t);return!!Array.isArray(n)&&(n.forEach((t=>{t(e)})),!0)}has(t){if(this._listeners.has(t)){const e=this._listeners.get(t);if(Array.isArray(e)&&e.length>0)return!0}return!1}},t.Store=class{constructor(t){this._backUpDefaultStorage=s(t.defaultStorage),this._temp=this._createTempStorage()}set(t,e){this._temp[t]=e}get(t){return this._temp[t]}getSnapshot(){return s(this._temp)}clear(){this._temp=this._createTempStorage()}_createTempStorage(){return s(this._backUpDefaultStorage)}},t.calcDistance=b,t.calcElementCenter=I,t.calcElementCenterFromVertexes=S,t.calcElementQueueVertexesQueueInGroup=F,t.calcElementSizeController=function(t,e){const{groupQueue:n,controllerSize:o,viewScaleInfo:r}=e,a=(o&&o>0?o:8)/r.scale,{x:s,y:l,w:c,h:u,angle:h=0}=t,f=[{uuid:i(),x:s,y:l,w:c,h:u,angle:h,type:"group",detail:{children:[]}},...n];let d=0;f.forEach((({angle:t=0})=>{d+=t}));const x=q(t,{groupQueue:n}),g=_(x[0],x[1]),m=_(x[1],x[2]),y=_(x[2],x[3]),p=_(x[3],x[0]),v=x[0],w=x[1],b=x[2],P=x[3],$=G(g,{size:a,angle:d}),R=G(m,{size:a,angle:d}),M=G(y,{size:a,angle:d}),I=G(p,{size:a,angle:d}),S=G(v,{size:a,angle:d}),k=G(w,{size:a,angle:d}),E=G(P,{size:a,angle:d}),A=G(b,{size:a,angle:d});return{elementWrapper:x,left:{type:"left",vertexes:j(I),center:p},right:{type:"right",vertexes:j(R),center:m},top:{type:"top",vertexes:j($),center:g},bottom:{type:"bottom",vertexes:j(M),center:y},topLeft:{type:"top-left",vertexes:j(S),center:v},topRight:{type:"top-right",vertexes:j(k),center:w},bottomLeft:{type:"bottom-left",vertexes:j(E),center:P},bottomRight:{type:"bottom-right",vertexes:j(A),center:b}}},t.calcElementVertexesInGroup=q,t.calcElementVertexesQueueInGroup=B,t.calcElementsContextSize=T,t.calcElementsViewInfo=function(t,e,n){const i=T(t,{viewWidth:e.width,viewHeight:e.height,extend:null==n?void 0:n.extend});return!0===(null==n?void 0:n.extend)&&(i.contextWidth=Math.max(i.contextWidth,e.contextWidth),i.contextHeight=Math.max(i.contextHeight,e.contextHeight)),{contextSize:i}},t.calcSpeed=function(t,e){return b(t,e)/Math.abs(e.t-t.t)},t.calcViewElementSize=L,t.calcViewPointSize=V,t.calcViewVertexes=function(t,e){return[V(t[0],e),V(t[1],e),V(t[2],e),V(t[3],e)]},t.check=p,t.checkRectIntersect=W,t.colorNameToHex=function(t){const e=t.toLowerCase(),i=n[e];return"string"==typeof i?i:null},t.compose=function(t){return function(e,n){return function i(o){let r=t[o];o===t.length&&n&&(r=n);if(!r)return Promise.resolve();try{return Promise.resolve(r(e,i.bind(null,o+1)))}catch(t){return Promise.reject(t)}}(0)}},t.compressImage=function(t,e){let n=.5;const i=(null==e?void 0:e.type)||"image/png";return(null==e?void 0:e.radio)&&(null==e?void 0:e.radio)>0&&(null==e?void 0:e.radio)<=1&&(n=null==e?void 0:e.radio),new Promise(((e,o)=>{const r=new Image;r.addEventListener("load",(()=>{const{width:t,height:o}=r,a=t*n,s=o*n;let l=document.createElement("canvas");l.width=a,l.height=s;l.getContext("2d").drawImage(r,0,0,a,s);const c=l.toDataURL(i);l=null,e(c)})),r.addEventListener("error",(t=>{o(t)})),r.src=t}))},t.createAssetId=r,t.createBoardContexts=function(t,e){const n={width:t.canvas.width,height:t.canvas.height,devicePixelRatio:(null==e?void 0:e.devicePixelRatio)||1};return{viewContext:w(n),helperContext:w(n),boardContext:w({ctx:t,...n})}},t.createContext2D=w,t.createOffscreenContext2D=function(t){const{width:e,height:n}=t;return new OffscreenCanvas(e,n).getContext("2d").canvas.getContext("2d")},t.createUUID=i,t.deepClone=s,t.delay=function(t){return new Promise((e=>{setTimeout((()=>{e()}),t)}))},t.downloadImageFromCanvas=function(t,e){const{filename:n,type:i="image/jpeg"}=e,o=t.toDataURL(i),r=document.createElement("a");r.href=o,r.download=n;const a=document.createEvent("MouseEvents");a.initEvent("click",!0,!1),r.dispatchEvent(a)},t.equalPoint=P,t.equalTouchPoint=function(t,e){return!0===P(t,e)&&t.f===e.f},t.findElementFromList=function t(e,n){var i;let o=null;for(let r=0;r<n.length;r++){const a=n[r];if(a.uuid===e){o=a;break}if(!o&&"group"===a.type){const n=t(e,(null==(i=null==a?void 0:a.detail)?void 0:i.children)||[]);if((null==n?void 0:n.uuid)===e){o=n;break}}}return o},t.findElementsFromList=function(t,e){const n=[];return function e(i){var o;for(let r=0;r<i.length;r++){const a=i[r];t.includes(a.uuid)?n.push(a):"group"===a.type&&e((null==(o=null==a?void 0:a.detail)?void 0:o.children)||[])}}(e),n},t.formatNumber=function(t,e){const n=(null==e?void 0:e.decimalPlaces)||2;return parseFloat(t.toFixed(n))},t.generateHTML=function(t){return t.reduce((function(t,e){return t+K("",e)}),"")},t.generateSVGPath=function(t){let e="";return t.forEach((t=>{e+=t.type+t.params.join(" ")})),e},t.getCenterFromTwoPoints=_,t.getElemenetsAssetIds=function(t){const e=[],n=t=>{t.forEach((t=>{"image"===t.type&&a(t.detail.src)?e.push(t.detail.src):"svg"===t.type&&a(t.detail.svg)?e.push(t.detail.svg):"html"===t.type&&t.detail.html?e.push(t.detail.html):"group"===t.type&&Array.isArray(t.detail.children)&&n(t.detail.children)}))};return n(t),e},t.getElementRotateVertexes=E,t.getElementVertexes=H,t.getGroupQueueFromList=function(t,e){const n=[];return function t(e,i){var o;let r=null;for(let a=0;a<i.length;a++){const s=i[a];if(s.uuid===e){r=s;break}if(!r&&"group"===s.type){n.push(s);const i=t(e,(null==(o=null==s?void 0:s.detail)?void 0:o.children)||[]);if((null==i?void 0:i.uuid)===e){r=i;break}n.pop()}}return r}(t,e),n},t.getSelectedElementUUIDs=function(t,e){var n;let i=[];return Array.isArray(null==t?void 0:t.elements)&&(null==(n=null==t?void 0:t.elements)?void 0:n.length)>0&&Array.isArray(e)&&e.length>0&&e.forEach((e=>{var n;"number"==typeof e?(null==(n=null==t?void 0:t.elements)?void 0:n[e])&&i.push(t.elements[e].uuid):"string"==typeof e&&(i=i.concat(function(t,e){var n;const i=[];if("string"==typeof e&&/^\d+(\.\d+)*$/.test(e)){const o=e.split(".");let r=t;for(;o.length>0;){const t=o.shift();if("string"==typeof t){const e=r[parseInt(t)];e&&0===o.length?i.push(e.uuid):"group"===e.type&&o.length>0&&(r=(null==(n=null==e?void 0:e.detail)?void 0:n.children)||[])}break}}return i}(t.elements,e)))})),i},t.getViewPointAtElement=function(t,e){var n,i,o;const{context2d:r,data:a,viewScaleInfo:s,viewSizeInfo:l,groupQueue:c}=e,u={index:-1,element:null,groupQueueIndex:-1};if(c&&Array.isArray(c)&&(null==c?void 0:c.length)>0)for(let e=c.length-1;e>=0;e--){let o=0,a=0,h=0;for(let t=0;t<=e;t++)o+=c[t].x,a+=c[t].y,h+=c[t].angle||0;const f=c[e];if(f&&"group"===f.type&&Array.isArray(null==(n=f.detail)?void 0:n.children))for(let n=0;n<f.detail.children.length;n++){const d=f.detail.children[n];if(!0!==(null==(i=null==d?void 0:d.operations)?void 0:i.invisible)){if(!d)break;if(D(t,{context2d:r,element:{x:o+d.x,y:a+d.y,w:d.w,h:d.h,angle:h+(d.angle||0)},viewScaleInfo:s,viewSizeInfo:l})){u.element=d,(e<c.length-1||"group"!==d.type)&&(u.groupQueueIndex=e);break}}}if(u.element)break}if(u.element)return u;for(let e=a.elements.length-1;e>=0;e--){const n=a.elements[e];if(!0!==(null==(o=null==n?void 0:n.operations)?void 0:o.invisible)&&D(t,{context2d:r,element:n,viewScaleInfo:s,viewSizeInfo:l})){u.index=e,u.element=n;break}}return u},t.getViewScaleInfoFromSnapshot=function(t){const{activeStore:e}=t;return{scale:null==e?void 0:e.scale,offsetTop:null==e?void 0:e.offsetTop,offsetBottom:null==e?void 0:e.offsetBottom,offsetLeft:null==e?void 0:e.offsetLeft,offsetRight:null==e?void 0:e.offsetRight}},t.getViewSizeInfoFromSnapshot=function(t){const{activeStore:e}=t;return{devicePixelRatio:e.devicePixelRatio,width:null==e?void 0:e.width,height:null==e?void 0:e.height,contextWidth:null==e?void 0:e.contextWidth,contextHeight:null==e?void 0:e.contextHeight}},t.is=m,t.isAssetId=a,t.isColorStr=e,t.isElementInView=function(t,e){const{viewSizeInfo:n,viewScaleInfo:i}=e,{width:o,height:r}=n,{angle:a}=t,{x:s,y:l,w:c,h:u}=L(t,{viewScaleInfo:i,viewSizeInfo:n}),h=A({x:s,y:l,w:c,h:u,angle:a}),f={x:0,y:0,w:o,h:r},d=Math.min(h[0].x,h[1].x,h[2].x,h[3].x),x=Math.min(h[0].y,h[1].y,h[2].y,h[3].y);return W(f,{x:d,y:x,w:Math.max(h[0].x,h[1].x,h[2].x,h[3].x)-d,h:Math.max(h[0].y,h[1].y,h[2].y,h[3].y)-x})},t.isViewPointInElement=D,t.istype=c,t.limitAngle=O,t.loadHTML=async function(t,e){t=t.replace(/\&/gi,"&");const n=await function(t,e){const{width:n,height:i}=e;return new Promise(((e,o)=>{const r=new Blob([`\n <svg \n xmlns="http://www.w3.org/2000/svg" \n width="${n||""}" \n height = "${i||""}">\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"}),a=new FileReader;a.readAsDataURL(r),a.onload=function(t){var n;const i=null==(n=null==t?void 0:t.target)?void 0:n.result;e(i)},a.onerror=function(t){o(t)}}))}(t,e);return await h(n)},t.loadImage=h,t.loadSVG=async function(t){const e=await function(t){return new Promise(((e,n)=>{const i=new Blob([t],{type:"image/svg+xml;charset=utf-8"}),o=new FileReader;o.readAsDataURL(i),o.onload=function(t){var n;const i=null==(n=null==t?void 0:t.target)?void 0:n.result;e(i)},o.onerror=function(t){n(t)}}))}(t);return await h(e)},t.parseAngleToRadian=M,t.parseHTML=function(t){const e=[],n=[];let i,o=-1;return t.replace(X,((r,a)=>{const s="/"!==r.charAt(1),l=r.startsWith("\x3c!--"),c=a+r.length,u=t.charAt(c);let h;if(l){const t=J(r);return o<0?(e.push(t),r):(h=n[o],h.children.push(t),r)}if(s){if(o++,i=J(r),!i.isVoid&&u&&"<"!==u){const e=t.slice(c,t.indexOf("<",c));e.trim()&&i.children.push({type:"text",name:null,attributes:{},children:[],isVoid:!1,textContent:e.trim()})}0===o&&e.push(i),h=n[o-1],h&&h.children.push(i),n[o]=i}if((!s||!Array.isArray(i)&&i.isVoid)&&(o>-1&&!Array.isArray(i)&&(i.isVoid||i.name===r.slice(2,-1))&&(o--,i=-1===o?e:n[o]),"<"!==u&&u)){h=-1===o?e:n[o].children;const i=t.indexOf("<",c);let r=t.slice(c,-1===i?void 0:i);Y.test(r)&&(r=" "),(i>-1&&o+h.length>=0||" "!==r)&&r.trim()&&h.push({type:"text",name:null,attributes:{},children:[],isVoid:!1,textContent:r.trim()})}return r})),e},t.parseRadianToAngle=function(t){return t/Math.PI*180},t.parseSVGPath=function(t){const e=[];return t.replace(U,((t,n,i)=>{const o=i.match(Q),r={type:n,params:o?o.map(Number):[]};return e.push(r),t})),e},t.rotateElement=function(t,e,n){const i=I(e),o=M(e.angle||0);i&&(o>0||o<0)&&(t.translate(i.x,i.y),t.rotate(o),t.translate(-i.x,-i.y)),n(t),i&&(o>0||o<0)&&(t.translate(i.x,i.y),t.rotate(-o),t.translate(-i.x,-i.y))},t.rotateElementVertexes=A,t.rotatePoint=k,t.rotatePointInGroup=function(t,e){if((null==e?void 0:e.length)>0){let n=t.x,i=t.y;return e.forEach((t=>{const{x:e,y:o,w:r,h:a,angle:s=0}=t,l=k(I({x:e,y:o,w:r,h:a,angle:s}),{x:n,y:i},M(s));n=l.x,i=l.y})),{x:n,y:i}}return t},t.rotateVertexes=C,t.sortDataAsserts=function(t,e){const n=t.assets||{};let i=t;!0===(null==e?void 0:e.clone)&&(i=s(t));const o=t=>{t.forEach((t=>{if("image"===t.type&&t.detail.src){const e=t.detail.src,i=r(e);n[i]||(n[i]={type:"image",value:e}),t.detail.src=i}else if("svg"===t.type){const e=t.detail.svg,i=r(e);n[i]||(n[i]={type:"svg",value:e}),t.detail.svg=i}else if("html"===t.type){const e=t.detail.html,i=r(e);n[i]||(n[i]={type:"svg",value:e}),t.detail.html=i}else if("group"===t.type&&Array.isArray(t.detail.children)){const e=t.detail.assets||{};Object.keys(e).forEach((t=>{n[t]||(n[t]=e[t])})),delete t.detail.assets,o(t.detail.children)}}))};return o(i.elements),i.assets=n,i},t.throttle=function(t,e){let n=-1;return function(...i){n>0||(n=setTimeout((()=>{t(...i),n=-1}),e))}},t.toColorHexNum=function(t){return parseInt(t.replace(/^\#/,"0x"))},t.toColorHexStr=function(t){return"#"+t.toString(16)},t.updateElementInList=function t(e,n,i){var o;for(let r=0;r<i.length;r++){const a=i[r];if(a.uuid===e){z(a,n);break}"group"===a.type&&t(e,n,(null==(o=null==a?void 0:a.detail)?void 0:o.children)||[])}return i},t.vaildPoint=R,t.vaildTouchPoint=function(t){return!0===R(t)&&t.f>=0},t.validateElements=function t(e){let n=!0;if(Array.isArray(e)){const i=[];e.forEach((e=>{var o;"string"==typeof e.uuid&&e.uuid?i.includes(e.uuid)?(n=!1,console.warn(`Duplicate uuids: ${e.uuid}`)):i.push(e.uuid):(n=!1,console.warn("Element missing uuid",e)),"group"===e.type&&(n=t(null==(o=null==e?void 0:e.detail)?void 0:o.children))}))}return n},t.viewScale=function(t){const{scale:e,point:n,viewScaleInfo:i}=t,{offsetLeft:o,offsetTop:r}=i,a=e/i.scale,s=n.x,l=n.y;return{moveX:s-s*a+(o*a-o),moveY:l-l*a+(r*a-r)}},t.viewScroll=function(t){const{moveX:e=0,moveY:n=0,viewScaleInfo:i,viewSizeInfo:o}=t,{scale:r}=i,{width:a,height:s,contextWidth:l,contextHeight:c}=o;let u=i.offsetLeft,h=i.offsetRight,f=i.offsetTop,d=i.offsetBottom;return u+=e,f+=n,h=a-(l*r+u),d=s-(c*r+f),{scale:r,offsetTop:f,offsetLeft:u,offsetRight:h,offsetBottom:d}},Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),t}({});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@idraw/util",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.4.0-alpha.2",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "dist/esm/index.js",
|
|
6
6
|
"module": "dist/esm/index.js",
|
|
@@ -21,10 +21,10 @@
|
|
|
21
21
|
"author": "chenshenhai",
|
|
22
22
|
"license": "MIT",
|
|
23
23
|
"devDependencies": {
|
|
24
|
-
"@idraw/types": "^0.
|
|
24
|
+
"@idraw/types": "^0.4.0-alpha.0"
|
|
25
25
|
},
|
|
26
26
|
"publishConfig": {
|
|
27
27
|
"access": "public"
|
|
28
28
|
},
|
|
29
|
-
"gitHead": "
|
|
30
|
-
}
|
|
29
|
+
"gitHead": "5cc462b9206ea0e4e70b5183771dfbf694402483"
|
|
30
|
+
}
|
package/LICENSE
DELETED
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
MIT License
|
|
2
|
-
|
|
3
|
-
Copyright (c) 2021-present idrawjs
|
|
4
|
-
|
|
5
|
-
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
-
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
-
in the Software without restriction, including without limitation the rights
|
|
8
|
-
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
-
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
-
furnished to do so, subject to the following conditions:
|
|
11
|
-
|
|
12
|
-
The above copyright notice and this permission notice shall be included in all
|
|
13
|
-
copies or substantial portions of the Software.
|
|
14
|
-
|
|
15
|
-
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
-
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
-
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
-
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
-
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
-
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
-
SOFTWARE.
|
|
@@ -1,80 +0,0 @@
|
|
|
1
|
-
import { IDrawContext, BoardSizeOptions } from '@idraw/types';
|
|
2
|
-
type Options = {
|
|
3
|
-
width: number;
|
|
4
|
-
height: number;
|
|
5
|
-
contextWidth: number;
|
|
6
|
-
contextHeight: number;
|
|
7
|
-
devicePixelRatio: number;
|
|
8
|
-
};
|
|
9
|
-
type Transform = {
|
|
10
|
-
scale?: number;
|
|
11
|
-
scrollX?: number;
|
|
12
|
-
scrollY?: number;
|
|
13
|
-
};
|
|
14
|
-
declare class Context implements IDrawContext {
|
|
15
|
-
private _opts;
|
|
16
|
-
private _ctx;
|
|
17
|
-
private _transform;
|
|
18
|
-
constructor(ctx: CanvasRenderingContext2D, opts: Options);
|
|
19
|
-
getContext(): CanvasRenderingContext2D;
|
|
20
|
-
resetSize(opts: BoardSizeOptions): void;
|
|
21
|
-
calcDeviceNum(num: number): number;
|
|
22
|
-
calcScreenNum(num: number): number;
|
|
23
|
-
getSize(): {
|
|
24
|
-
width: number;
|
|
25
|
-
height: number;
|
|
26
|
-
contextWidth: number;
|
|
27
|
-
contextHeight: number;
|
|
28
|
-
devicePixelRatio: number;
|
|
29
|
-
};
|
|
30
|
-
setTransform(config: Transform): void;
|
|
31
|
-
getTransform(): {
|
|
32
|
-
scale: number;
|
|
33
|
-
scrollX: number;
|
|
34
|
-
scrollY: number;
|
|
35
|
-
};
|
|
36
|
-
setFillStyle(color: string | CanvasPattern | CanvasGradient): void;
|
|
37
|
-
fill(fillRule?: CanvasFillRule | undefined): void;
|
|
38
|
-
arc(x: number, y: number, radius: number, startAngle: number, endAngle: number, anticlockwise?: boolean | undefined): void;
|
|
39
|
-
rect(x: number, y: number, w: number, h: number): void;
|
|
40
|
-
fillRect(x: number, y: number, w: number, h: number): void;
|
|
41
|
-
clearRect(x: number, y: number, w: number, h: number): void;
|
|
42
|
-
beginPath(): void;
|
|
43
|
-
closePath(): void;
|
|
44
|
-
lineTo(x: number, y: number): void;
|
|
45
|
-
moveTo(x: number, y: number): void;
|
|
46
|
-
arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void;
|
|
47
|
-
setLineWidth(w: number): number;
|
|
48
|
-
setLineDash(nums: number[]): void;
|
|
49
|
-
isPointInPath(x: number, y: number): boolean;
|
|
50
|
-
isPointInPathWithoutScroll(x: number, y: number): boolean;
|
|
51
|
-
setStrokeStyle(color: string): void;
|
|
52
|
-
stroke(): void;
|
|
53
|
-
translate(x: number, y: number): void;
|
|
54
|
-
rotate(angle: number): void;
|
|
55
|
-
drawImage(...args: any[]): void;
|
|
56
|
-
createPattern(image: CanvasImageSource, repetition: string | null): CanvasPattern | null;
|
|
57
|
-
measureText(text: string): TextMetrics;
|
|
58
|
-
setTextAlign(align: CanvasTextAlign): void;
|
|
59
|
-
fillText(text: string, x: number, y: number, maxWidth?: number | undefined): void;
|
|
60
|
-
strokeText(text: string, x: number, y: number, maxWidth?: number | undefined): void;
|
|
61
|
-
setFont(opts: {
|
|
62
|
-
fontSize: number;
|
|
63
|
-
fontFamily?: string;
|
|
64
|
-
fontWeight?: 'bold';
|
|
65
|
-
}): void;
|
|
66
|
-
setTextBaseline(baseline: CanvasTextBaseline): void;
|
|
67
|
-
setGlobalAlpha(alpha: number): void;
|
|
68
|
-
save(): void;
|
|
69
|
-
restore(): void;
|
|
70
|
-
scale(ratioX: number, ratioY: number): void;
|
|
71
|
-
setShadowColor(color: string): void;
|
|
72
|
-
setShadowOffsetX(offsetX: number): void;
|
|
73
|
-
setShadowOffsetY(offsetY: number): void;
|
|
74
|
-
setShadowBlur(blur: number): void;
|
|
75
|
-
ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number, startAngle: number, endAngle: number, counterclockwise?: boolean | undefined): void;
|
|
76
|
-
private _doSize;
|
|
77
|
-
private _doX;
|
|
78
|
-
private _doY;
|
|
79
|
-
}
|
|
80
|
-
export default Context;
|
package/dist/esm/lib/context.js
DELETED
|
@@ -1,194 +0,0 @@
|
|
|
1
|
-
class Context {
|
|
2
|
-
constructor(ctx, opts) {
|
|
3
|
-
this._opts = opts;
|
|
4
|
-
this._ctx = ctx;
|
|
5
|
-
this._transform = {
|
|
6
|
-
scale: 1,
|
|
7
|
-
scrollX: 0,
|
|
8
|
-
scrollY: 0
|
|
9
|
-
};
|
|
10
|
-
}
|
|
11
|
-
getContext() {
|
|
12
|
-
return this._ctx;
|
|
13
|
-
}
|
|
14
|
-
resetSize(opts) {
|
|
15
|
-
this._opts = Object.assign(Object.assign({}, this._opts), opts);
|
|
16
|
-
}
|
|
17
|
-
calcDeviceNum(num) {
|
|
18
|
-
return num * this._opts.devicePixelRatio;
|
|
19
|
-
}
|
|
20
|
-
calcScreenNum(num) {
|
|
21
|
-
return num / this._opts.devicePixelRatio;
|
|
22
|
-
}
|
|
23
|
-
getSize() {
|
|
24
|
-
return {
|
|
25
|
-
width: this._opts.width,
|
|
26
|
-
height: this._opts.height,
|
|
27
|
-
contextWidth: this._opts.contextWidth,
|
|
28
|
-
contextHeight: this._opts.contextHeight,
|
|
29
|
-
devicePixelRatio: this._opts.devicePixelRatio
|
|
30
|
-
};
|
|
31
|
-
}
|
|
32
|
-
setTransform(config) {
|
|
33
|
-
this._transform = Object.assign(Object.assign({}, this._transform), config);
|
|
34
|
-
}
|
|
35
|
-
getTransform() {
|
|
36
|
-
return {
|
|
37
|
-
scale: this._transform.scale,
|
|
38
|
-
scrollX: this._transform.scrollX,
|
|
39
|
-
scrollY: this._transform.scrollY
|
|
40
|
-
};
|
|
41
|
-
}
|
|
42
|
-
setFillStyle(color) {
|
|
43
|
-
this._ctx.fillStyle = color;
|
|
44
|
-
}
|
|
45
|
-
fill(fillRule) {
|
|
46
|
-
return this._ctx.fill(fillRule || 'nonzero');
|
|
47
|
-
}
|
|
48
|
-
arc(x, y, radius, startAngle, endAngle, anticlockwise) {
|
|
49
|
-
return this._ctx.arc(this._doSize(x), this._doSize(y), this._doSize(radius), startAngle, endAngle, anticlockwise);
|
|
50
|
-
}
|
|
51
|
-
rect(x, y, w, h) {
|
|
52
|
-
return this._ctx.rect(this._doSize(x), this._doSize(y), this._doSize(w), this._doSize(h));
|
|
53
|
-
}
|
|
54
|
-
fillRect(x, y, w, h) {
|
|
55
|
-
return this._ctx.fillRect(this._doSize(x), this._doSize(y), this._doSize(w), this._doSize(h));
|
|
56
|
-
}
|
|
57
|
-
clearRect(x, y, w, h) {
|
|
58
|
-
return this._ctx.clearRect(this._doSize(x), this._doSize(y), this._doSize(w), this._doSize(h));
|
|
59
|
-
}
|
|
60
|
-
beginPath() {
|
|
61
|
-
return this._ctx.beginPath();
|
|
62
|
-
}
|
|
63
|
-
closePath() {
|
|
64
|
-
return this._ctx.closePath();
|
|
65
|
-
}
|
|
66
|
-
lineTo(x, y) {
|
|
67
|
-
return this._ctx.lineTo(this._doSize(x), this._doSize(y));
|
|
68
|
-
}
|
|
69
|
-
moveTo(x, y) {
|
|
70
|
-
return this._ctx.moveTo(this._doSize(x), this._doSize(y));
|
|
71
|
-
}
|
|
72
|
-
arcTo(x1, y1, x2, y2, radius) {
|
|
73
|
-
return this._ctx.arcTo(this._doSize(x1), this._doSize(y1), this._doSize(x2), this._doSize(y2), this._doSize(radius));
|
|
74
|
-
}
|
|
75
|
-
setLineWidth(w) {
|
|
76
|
-
return (this._ctx.lineWidth = this._doSize(w));
|
|
77
|
-
}
|
|
78
|
-
setLineDash(nums) {
|
|
79
|
-
return this._ctx.setLineDash(nums.map((n) => this._doSize(n)));
|
|
80
|
-
}
|
|
81
|
-
isPointInPath(x, y) {
|
|
82
|
-
return this._ctx.isPointInPath(this._doX(x), this._doY(y));
|
|
83
|
-
}
|
|
84
|
-
isPointInPathWithoutScroll(x, y) {
|
|
85
|
-
return this._ctx.isPointInPath(this._doSize(x), this._doSize(y));
|
|
86
|
-
}
|
|
87
|
-
setStrokeStyle(color) {
|
|
88
|
-
this._ctx.strokeStyle = color;
|
|
89
|
-
}
|
|
90
|
-
stroke() {
|
|
91
|
-
return this._ctx.stroke();
|
|
92
|
-
}
|
|
93
|
-
translate(x, y) {
|
|
94
|
-
return this._ctx.translate(this._doSize(x), this._doSize(y));
|
|
95
|
-
}
|
|
96
|
-
rotate(angle) {
|
|
97
|
-
return this._ctx.rotate(angle);
|
|
98
|
-
}
|
|
99
|
-
drawImage(...args) {
|
|
100
|
-
const image = args[0];
|
|
101
|
-
const sx = args[1];
|
|
102
|
-
const sy = args[2];
|
|
103
|
-
const sw = args[3];
|
|
104
|
-
const sh = args[4];
|
|
105
|
-
const dx = args[args.length - 4];
|
|
106
|
-
const dy = args[args.length - 3];
|
|
107
|
-
const dw = args[args.length - 2];
|
|
108
|
-
const dh = args[args.length - 1];
|
|
109
|
-
if (args.length === 9) {
|
|
110
|
-
return this._ctx.drawImage(image, this._doSize(sx), this._doSize(sy), this._doSize(sw), this._doSize(sh), this._doSize(dx), this._doSize(dy), this._doSize(dw), this._doSize(dh));
|
|
111
|
-
}
|
|
112
|
-
else {
|
|
113
|
-
return this._ctx.drawImage(image, this._doSize(dx), this._doSize(dy), this._doSize(dw), this._doSize(dh));
|
|
114
|
-
}
|
|
115
|
-
}
|
|
116
|
-
createPattern(image, repetition) {
|
|
117
|
-
return this._ctx.createPattern(image, repetition);
|
|
118
|
-
}
|
|
119
|
-
measureText(text) {
|
|
120
|
-
return this._ctx.measureText(text);
|
|
121
|
-
}
|
|
122
|
-
setTextAlign(align) {
|
|
123
|
-
this._ctx.textAlign = align;
|
|
124
|
-
}
|
|
125
|
-
fillText(text, x, y, maxWidth) {
|
|
126
|
-
if (maxWidth !== undefined) {
|
|
127
|
-
return this._ctx.fillText(text, this._doSize(x), this._doSize(y), this._doSize(maxWidth));
|
|
128
|
-
}
|
|
129
|
-
else {
|
|
130
|
-
return this._ctx.fillText(text, this._doSize(x), this._doSize(y));
|
|
131
|
-
}
|
|
132
|
-
}
|
|
133
|
-
strokeText(text, x, y, maxWidth) {
|
|
134
|
-
if (maxWidth !== undefined) {
|
|
135
|
-
return this._ctx.strokeText(text, this._doSize(x), this._doSize(y), this._doSize(maxWidth));
|
|
136
|
-
}
|
|
137
|
-
else {
|
|
138
|
-
return this._ctx.strokeText(text, this._doSize(x), this._doSize(y));
|
|
139
|
-
}
|
|
140
|
-
}
|
|
141
|
-
setFont(opts) {
|
|
142
|
-
const strList = [];
|
|
143
|
-
if (opts.fontWeight === 'bold') {
|
|
144
|
-
strList.push(`${opts.fontWeight}`);
|
|
145
|
-
}
|
|
146
|
-
strList.push(`${this._doSize(opts.fontSize || 12)}px`);
|
|
147
|
-
strList.push(`${opts.fontFamily || 'sans-serif'}`);
|
|
148
|
-
this._ctx.font = `${strList.join(' ')}`;
|
|
149
|
-
}
|
|
150
|
-
setTextBaseline(baseline) {
|
|
151
|
-
this._ctx.textBaseline = baseline;
|
|
152
|
-
}
|
|
153
|
-
setGlobalAlpha(alpha) {
|
|
154
|
-
this._ctx.globalAlpha = alpha;
|
|
155
|
-
}
|
|
156
|
-
save() {
|
|
157
|
-
this._ctx.save();
|
|
158
|
-
}
|
|
159
|
-
restore() {
|
|
160
|
-
this._ctx.restore();
|
|
161
|
-
}
|
|
162
|
-
scale(ratioX, ratioY) {
|
|
163
|
-
this._ctx.scale(ratioX, ratioY);
|
|
164
|
-
}
|
|
165
|
-
setShadowColor(color) {
|
|
166
|
-
this._ctx.shadowColor = color;
|
|
167
|
-
}
|
|
168
|
-
setShadowOffsetX(offsetX) {
|
|
169
|
-
this._ctx.shadowOffsetX = this._doSize(offsetX);
|
|
170
|
-
}
|
|
171
|
-
setShadowOffsetY(offsetY) {
|
|
172
|
-
this._ctx.shadowOffsetY = this._doSize(offsetY);
|
|
173
|
-
}
|
|
174
|
-
setShadowBlur(blur) {
|
|
175
|
-
this._ctx.shadowBlur = this._doSize(blur);
|
|
176
|
-
}
|
|
177
|
-
ellipse(x, y, radiusX, radiusY, rotation, startAngle, endAngle, counterclockwise) {
|
|
178
|
-
this._ctx.ellipse(this._doSize(x), this._doSize(y), this._doSize(radiusX), this._doSize(radiusY), rotation, startAngle, endAngle, counterclockwise);
|
|
179
|
-
}
|
|
180
|
-
_doSize(num) {
|
|
181
|
-
return this._opts.devicePixelRatio * num;
|
|
182
|
-
}
|
|
183
|
-
_doX(x) {
|
|
184
|
-
const { scale, scrollX } = this._transform;
|
|
185
|
-
const _x = (x - scrollX) / scale;
|
|
186
|
-
return this._doSize(_x);
|
|
187
|
-
}
|
|
188
|
-
_doY(y) {
|
|
189
|
-
const { scale, scrollY } = this._transform;
|
|
190
|
-
const _y = (y - scrollY) / scale;
|
|
191
|
-
return this._doSize(_y);
|
|
192
|
-
}
|
|
193
|
-
}
|
|
194
|
-
export default Context;
|
|
File without changes
|