lucky-canvas - npm Package Compare versions

Comparing version 1.0.3 to 1.0.4

dist/lucky-canvas.cjs.js

@@ -865,4 +865,12 @@ 'use strict';
             this.stopDeg = rotateDeg;
-            // 最终停止的角度
-            this.endDeg = 360 * 5 - prizeFlag * prizeDeg - rotateDeg - _defaultConfig.offsetDegree;
+            // 测算最终停止的角度
+            let i = 0;
+            while (++i) {
+                const endDeg = 360 * i - prizeFlag * prizeDeg - rotateDeg - _defaultConfig.offsetDegree;
+                let currSpeed = quad.easeOut(this.FPS, this.stopDeg, endDeg, _defaultConfig.decelerationTime) - this.stopDeg;
+                if (currSpeed > _defaultConfig.speed) {
+                    this.endDeg = endDeg;
+                    break;
+                }
+            }
             cancelAnimationFrame(this.animationId);
@@ -1419,4 +1427,12 @@ return this.slowDown();
             this.stopIndex = currIndex;
-            // 最终停止的索引
-            this.endIndex = prizes.length * 5 + prizeFlag - (currIndex >> 0);
+            // 测算最终停止的索引
+            let i = 0;
+            while (++i) {
+                const endIndex = prizes.length * i + prizeFlag - (currIndex >> 0);
+                let currSpeed = quad.easeOut(this.FPS, this.stopIndex, endIndex, _defaultConfig.decelerationTime) - this.stopIndex;
+                if (currSpeed > _defaultConfig.speed) {
+                    this.endIndex = endIndex;
+                    break;
+                }
+            }
             cancelAnimationFrame(this.animationId);
@@ -1423,0 +1439,0 @@ return this.slowDown();

dist/lucky-canvas.cjs.min.js

@@ -1,1 +0,1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});class t{constructor(){this.htmlFontSize=16,this.dpr=1,this.subs={},this.setDpr(),this.setHTMLFontSize(),this.resetArrayPropo()}setDpr(){window.dpr=this.dpr=1.3*(window.devicePixelRatio||2)}setHTMLFontSize(){this.htmlFontSize=+getComputedStyle(document.documentElement).fontSize.slice(0,-2)}optimizeClarity(t,i,e){const{dpr:s}=this,h=t=>(t*s-t)/(t*s)*(s/2)*100;t.style.transform=`scale(${1/s}) translate(\n      ${-h(i)}%, ${-h(e)}%\n    )`}changeUnits(t,{denominator:i=1,clean:e=!1}){return Number(t.replace(/^(\-*[0-9.]*)([a-z%]*)$/,((t,s,h)=>{switch(h){case"%":s*=i/100;break;case"px":s*=1;break;case"rem":s*=this.htmlFontSize;break;default:s*=1}return e||"%"===h?s:s*this.dpr})))}draw(){}observer(t){t&&"object"==typeof t&&Object.keys(t).forEach((i=>{this.defineReactive(t,i,t[i])}))}defineReactive(t,i,e){this.observer(e),Object.defineProperty(t,i,{get:()=>e,set:t=>{let s=e;t!==e&&(e=t,this.observer(e),this.subs[i]&&this.subs[i].call(this,e,s),this.draw())}})}$set(t,i,e){t&&"object"==typeof t&&this.defineReactive(t,i,e)}$computed(t,i,e){Object.defineProperty(t,i,{get:()=>e.call(this)})}$watch(t,i){this.subs[t]=i}resetArrayPropo(){const t=this,i=Array.prototype,e=Object.create(i);["push","pop","shift","unshift","sort","splice","reverse"].forEach((s=>{e[s]=function(){t.draw(),i[s].call(this,...arguments)}}))}}const i=(t,...i)=>i.some((i=>Object.prototype.toString.call(t).slice(8,-1).toLowerCase()===i)),e=t=>[].filter.call(t,(t=>"\n"!==t)).join(""),s=t=>Math.PI/180*t,h=(t,i)=>[+(Math.cos(t)*i).toFixed(8),+(Math.sin(t)*i).toFixed(8)],n=(t,i)=>{let e=-t/i;return[e,-e*t+i]},r=(t,i,e,o,a=!0)=>{if(Math.abs(o-e).toFixed(8)>=s(180).toFixed(8)){let s=(o+e)/2;return a?(r(t,i,e,s,a),r(t,i,s,o,a)):(r(t,i,s,o,a),r(t,i,e,s,a)),!1}a||([e,o]=[o,e]);const[l,d]=h(e,i),[c,g]=h(o,i),[f,u]=n(l,d),[m,p]=n(c,g);let w=(p-u)/(f-m),b=(m*u-f*p)/(m-f);isNaN(w)&&(Math.abs(l)===+i.toFixed(8)&&(w=l),Math.abs(c)===+i.toFixed(8)&&(w=c)),f===1/0||f===-1/0?b=m*w+p:m!==1/0&&m!==-1/0||(b=f*w+u),t.lineTo(l,d),t.arcTo(w,b,c,g,i)},o=(t,i,e,s,h,n,r)=>{let o=Math.min(s,h);n>o/2&&(n=o/2),t.beginPath(),t.fillStyle=r,t.moveTo(i+n,e),t.lineTo(i+n,e),t.lineTo(i+s-n,e),t.arcTo(i+s,e,i+s,e+n,n),t.lineTo(i+s,e+h-n),t.arcTo(i+s,e+h,i+s-n,e+h,n),t.lineTo(i+n,e+h),t.arcTo(i,e+h,i,e+h-n,n),t.lineTo(i,e+n),t.arcTo(i,e,i+n,e,n),t.closePath(),t.fill()},a=function(t,i,e,s){return t>=s&&(t=s),e*(t/=s)*t+i},l=function(t,i,e,s){return t>=s&&(t=s),-e*(t/=s)*(t-2)+i};exports.LuckyGrid=class extends t{constructor(t,i={}){super(),this.rows=3,this.cols=3,this.blocks=[],this.prizes=[],this.defaultConfig={},this._defaultConfig={gutter:5,speed:20,accelerationTime:2500,decelerationTime:2500},this.defaultStyle={},this._defaultStyle={borderRadius:20,fontColor:"#000",fontSize:"18px",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",lineHeight:"",background:"#fff",shadow:"",wordWrap:!0,lengthLimit:"90%"},this.activeStyle={},this._activeStyle={background:"#ffce98",shadow:"",fontStyle:"",fontWeight:"",fontSize:"",lineHeight:"",fontColor:""},this.boxWidth=0,this.boxHeight=0,this.cellWidth=0,this.cellHeight=0,this.startTime=0,this.endTime=0,this.currIndex=0,this.stopIndex=0,this.endIndex=0,this.demo=!1,this.timer=0,this.animationId=0,this.FPS=16.6,this.cells=[],this.cellImgs=[],this.box=document.querySelector(t),this.canvas=document.createElement("canvas"),this.box.appendChild(this.canvas),this.ctx=this.canvas.getContext("2d"),this.initData(i),this.initComputed(),this.initWatch();let e=[[]];this.prizes&&(e=this.prizes.map((t=>t.imgs))),this.button&&(e[this.cols*this.rows-1]=this.button.imgs),this.init(e)}initData(t){this.$set(this,"rows",Number(t.rows)||3),this.$set(this,"cols",Number(t.cols)||3),this.$set(this,"blocks",t.blocks||[]),this.$set(this,"prizes",t.prizes||[]),this.$set(this,"button",t.button),this.$set(this,"defaultConfig",t.defaultConfig||{}),this.$set(this,"defaultStyle",t.defaultStyle||{}),this.$set(this,"activeStyle",t.activeStyle||{}),this.$set(this,"startCallback",t.start),this.$set(this,"endCallback",t.end)}initComputed(){this.$computed(this,"_defaultConfig",(()=>{const t={gutter:5,speed:20,accelerationTime:2500,decelerationTime:2500,...this.defaultConfig};return t.gutter=this.getLength(t.gutter)*this.dpr,t.speed=t.speed/40,t})),this.$computed(this,"_defaultStyle",(()=>({borderRadius:20,fontColor:"#000",fontSize:"18px",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",background:"#fff",shadow:"",wordWrap:!0,lengthLimit:"90%",...this.defaultStyle}))),this.$computed(this,"_activeStyle",(()=>({background:"#ffce98",shadow:"",...this.activeStyle})))}initWatch(){this.$watch("prizes",((t,i)=>{let e=[];return i?t&&t.forEach(((t,s)=>{let h=[];const n=i[s];n?t.imgs&&t.imgs.forEach(((t,i)=>{if(!n.imgs)return h[i]=t;const e=n.imgs[i];e&&this.cellImgs[s][i]?t.src!==e.src&&(h[i]=t):h[i]=t})):h=t.imgs||[],e[s]=h})):e=t.map((t=>t.imgs)),this.init(e)})),this.$watch("button",((t,i)=>{let e=[],s=this.cols*this.rows-1;if(i&&i.imgs){if(t.imgs){const h=[];t.imgs.forEach(((t,e)=>{if(!i.imgs)return h[e]=t;const n=i.imgs[e];n&&this.cellImgs[s][e]?t.src!==n.src&&(h[e]=t):h[e]=t})),e[s]=h}}else e[s]=t.imgs;return this.init(e)}))}init(t){this.setDpr(),this.setHTMLFontSize();const{box:e,canvas:s,dpr:h}=this;if(!e)return;this.boxWidth=s.width=e.offsetWidth*h,this.boxHeight=s.height=e.offsetHeight*h,this.optimizeClarity(s,this.boxWidth,this.boxHeight);const n=()=>{this.draw(),this.demo&&this.walk(),this.button&&(s.onclick=t=>{const[i,e,s,h]=this.getGeometricProperty([this.button.x,this.button.y,this.button.col||1,this.button.row||1]);if(t.offsetX<i||t.offsetY<e||t.offsetX>i+s||t.offsetY>e+h)return!1;this.startTime||this.startCallback?.(t)})};let r=0,o=0;i(t,"array")&&(this.draw(),t.forEach(((t,i)=>{if(!t)return!1;t.forEach(((t,e)=>{o++,this.loadAndCacheImg(i,e,(()=>{r++,o===r&&n.call(this)}))}))}))),o||n.call(this)}loadAndCacheImg(t,i,e){const s=this.cells[t];if(!s||!s.imgs)return;const h=s.imgs[i];this.cellImgs[t]||(this.cellImgs[t]=[]);let n=new Image;this.cellImgs[t][i]={defaultImg:n},n.src=h.src;let r=0,o=1;if(n.onload=()=>{r++,r===o&&e.call(this)},!h.hasOwnProperty("activeSrc"))return;o++;let a=new Image;this.cellImgs[t][i].activeImg=a,a.src=h.activeSrc,a.onload=()=>{r++,r===o&&e.call(this)}}computedWidthAndHeight(t,i,e){if(!i.width&&!i.height)return[t.width,t.height];if(i.width&&!i.height){let s=this.getWidth(i.width,e.col);return[s,t.height*(s/t.width)]}if(!i.width&&i.height){let s=this.getHeight(i.height,e.row);return[t.width*(s/t.height),s]}return[this.getWidth(i.width,e.col),this.getHeight(i.height,e.row)]}draw(){const{ctx:t,dpr:s,_defaultConfig:h,_defaultStyle:n,_activeStyle:r}=this;t.clearRect(0,0,this.boxWidth,this.boxWidth),this.cells=[...this.prizes],this.button&&(this.cells[this.cols*this.rows-1]=this.button),this.cells.forEach((t=>{t.col=t.col||1,t.row=t.row||1})),this.prizeArea=this.blocks.reduce((({x:e,y:h,w:n,h:r},a)=>{const[l,d,c,g]=(t=>{let e=t.padding.replace(/px/g,"").split(" ").map((t=>~~t))||[0],s=0,h=0,n=0,r=0;switch(e.length){case 1:s=h=n=r=e[0];break;case 2:s=h=e[0],n=r=e[1];break;case 3:s=e[0],n=r=e[1],h=e[2];break;default:s=e[0],h=e[1],n=e[2],r=e[3]}const o={paddingTop:s,paddingBottom:h,paddingLeft:n,paddingRight:r};for(let e in o)o[e]=t.hasOwnProperty(e)&&i(t[e],"string","number")?~~String(t[e]).replace(/px/g,""):o[e];return[s,h,n,r]})(a).map((t=>t*s)),f=a.borderRadius?this.getLength(a.borderRadius)*s:0;return o(t,e,h,n,r,f,this.handleBackground(e,h,n,r,a.background)),{x:e+c,y:h+l,w:n-c-g,h:r-l-d}}),{x:0,y:0,w:this.boxWidth,h:this.boxHeight}),this.cellWidth=(this.prizeArea.w-h.gutter*(this.cols-1))/this.cols,this.cellHeight=(this.prizeArea.h-h.gutter*(this.rows-1))/this.rows,this.cells.forEach(((i,h)=>{let[a,l,d,c]=this.getGeometricProperty([i.x,i.y,i.col,i.row]);const g=h===this.currIndex%this.prizes.length>>0,f=(g?r.shadow:i.shadow||n.shadow).replace(/px/g,"").split(",")[0].split(" ").map(((t,i)=>i<3?Number(t)*s:t));4===f.length&&(t.shadowColor=f[3],t.shadowOffsetX=f[0],t.shadowOffsetY=f[1],t.shadowBlur=f[2],f[0]>0?d-=f[0]:(d+=f[0],a-=f[0]),f[1]>0?c-=f[1]:(c+=f[1],l-=f[1])),o(t,a,l,d,c,this.getLength(i.borderRadius?i.borderRadius:n.borderRadius)*s,this.handleBackground(a,l,d,c,i.background,g)),t.shadowColor="rgba(255, 255, 255, 0)",t.shadowOffsetX=0,t.shadowOffsetY=0,t.shadowBlur=0,i.imgs&&i.imgs.forEach(((e,s)=>{if(!this.cellImgs[h])return!1;const n=this.cellImgs[h][s];if(!n)return!1;const r=g&&n.activeImg||n.defaultImg,[o,d]=this.computedWidthAndHeight(r,e,i);t.drawImage(r,a+this.getOffsetX(o,i.col),l+this.getHeight(e.top,i.row),o,d)})),i.fonts&&i.fonts.forEach((h=>{let o=g&&r.fontStyle?r.fontStyle:h.fontStyle||n.fontStyle,d=g&&r.fontWeight?r.fontWeight:h.fontWeight||n.fontWeight,c=g&&r.fontSize?this.getLength(r.fontSize):this.getLength(h.fontSize||n.fontSize);const f=g&&r.lineHeight?r.lineHeight:h.lineHeight||n.lineHeight||h.fontSize||n.fontSize;t.font=`${d} ${c*s}px ${o}`,t.fillStyle=g&&r.fontColor?r.fontColor:h.fontColor||n.fontColor;let u=[],m=String(h.text);if(h.hasOwnProperty("wordWrap")?h.wordWrap:n.wordWrap){m=e(m);let s="";for(let e=0;e<m.length;e++){s+=m[e],t.measureText(s).width>this.getWidth(h.lengthLimit||n.lengthLimit,i.col)&&(u.push(s.slice(0,-1)),s=m[e])}s&&u.push(s),u.length||u.push(m)}else u=m.split("\n");u.forEach(((e,n)=>{t.fillText(e,a+this.getOffsetX(t.measureText(e).width,i.col),l+this.getHeight(h.top,i.row)+(n+1)*this.getLength(f)*s)}))}))}))}handleBackground(t,i,e,s,h,n=!1){const{ctx:r,_defaultStyle:o,_activeStyle:a}=this;return(h=n?a.background:h||o.background).includes("linear-gradient")&&(h=((t,i,e,s,h,n)=>{const r=/linear-gradient\((.+)\)/.exec(n)[1].split(",").map((t=>t.trim()));let o=r.shift(),a=[0,0,0,0];if(o.includes("deg")){o=o.slice(0,-3)%360;const t=t=>Math.tan(t/180*Math.PI);o>=0&&o<45?a=[i,e+h,i+s,e+h-s*t(o-0)]:o>=45&&o<90?a=[i,e+h,i+s-h*t(o-45),e]:o>=90&&o<135?a=[i+s,e+h,i+s-h*t(o-90),e]:o>=135&&o<180?a=[i+s,e+h,i,e+s*t(o-135)]:o>=180&&o<225?a=[i+s,e,i,e+s*t(o-180)]:o>=225&&o<270?a=[i+s,e,i+h*t(o-225),e+h]:o>=270&&o<315?a=[i,e,i+h*t(o-270),e+h]:o>=315&&o<360&&(a=[i,e,i+s,e+h-s*t(o-315)])}else o.includes("top")?a=[i,e+h,i,e]:o.includes("bottom")?a=[i,e,i,e+h]:o.includes("left")?a=[i+s,e,i,e]:o.includes("right")&&(a=[i,e,i+s,e]);const l=t.createLinearGradient(...a.map((t=>t>>0)));return r.reduce(((t,i,e)=>{const s=i.split(" ");return 1===s.length?t.addColorStop(e,s[0]):2===s.length&&t.addColorStop(...s),t}),l)})(r,t,i,e,s,h)),h}play(){this.startTime||(clearInterval(this.timer),cancelAnimationFrame(this.animationId),this.startTime=Date.now(),this.prizeFlag=void 0,this.run())}stop(t){this.prizeFlag=t%this.prizes.length}run(t=0){const{currIndex:i,prizes:e,prizeFlag:s,startTime:h,_defaultConfig:n}=this;let r=Date.now()-h;if(r>=n.accelerationTime&&void 0!==s)return this.FPS=r/t,this.endTime=Date.now(),this.stopIndex=i,this.endIndex=5*e.length+s-(i>>0),cancelAnimationFrame(this.animationId),this.slowDown();this.currIndex=(i+a(r,.1,n.speed,n.accelerationTime))%e.length,this.draw(),this.animationId=window.requestAnimationFrame(this.run.bind(this,t+1))}slowDown(){const{prizes:t,prizeFlag:i,stopIndex:e,endIndex:s,_defaultConfig:h}=this;let n=Date.now()-this.endTime;if(n>h.decelerationTime)return this.startTime=0,this.endCallback?.({...t.find(((t,e)=>e===i))}),cancelAnimationFrame(this.animationId);this.currIndex=l(n,e,s,h.decelerationTime)%t.length,this.draw(),this.animationId=window.requestAnimationFrame(this.slowDown.bind(this))}walk(){clearInterval(this.timer),this.timer=window.setInterval((()=>{this.currIndex+=1,this.draw()}),1300)}getGeometricProperty([t,i,e,s]){const{cellWidth:h,cellHeight:n}=this,r=this._defaultConfig.gutter;let o=[this.prizeArea.x+(h+r)*t,this.prizeArea.y+(n+r)*i];return e&&s&&o.push(h*e+r*(e-1),n*s+r*(s-1)),o}getLength(t){return i(t,"number")?t:i(t,"string")?this.changeUnits(t,{clean:!0}):0}getWidth(t,e=1){return i(t,"number")?t*this.dpr:i(t,"string")?this.changeUnits(t,{denominator:this.cellWidth*e+this._defaultConfig.gutter*(e-1)}):0}getHeight(t,e=1){return i(t,"number")?t*this.dpr:i(t,"string")?this.changeUnits(t,{denominator:this.cellHeight*e+this._defaultConfig.gutter*(e-1)}):0}getOffsetX(t,i=1){return(this.cellWidth*i+this._defaultConfig.gutter*(i-1)-t)/2}},exports.LuckyWheel=class extends t{constructor(t,i={}){super(),this.blocks=[],this.prizes=[],this.buttons=[],this.defaultConfig={},this._defaultConfig={gutter:"0px",offsetDegree:0,speed:20,accelerationTime:2500,decelerationTime:2500},this.defaultStyle={},this._defaultStyle={fontSize:"18px",fontColor:"#000",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",lineHeight:"",background:"#fff",wordWrap:!0,lengthLimit:"90%"},this.Radius=0,this.prizeRadius=0,this.prizeDeg=0,this.prizeRadian=0,this.rotateDeg=0,this.maxBtnRadius=0,this.startTime=0,this.endTime=0,this.stopDeg=0,this.endDeg=0,this.animationId=0,this.FPS=16.6,this.prizeImgs=[[]],this.btnImgs=[[]],this.box=document.querySelector(t),this.canvas=document.createElement("canvas"),this.box.appendChild(this.canvas),this.ctx=this.canvas.getContext("2d"),this.initData(i),this.initComputed(),this.initWatch();let e=[[]];this.prizes&&(e=this.prizes.map((t=>t.imgs))),this.buttons&&e.push(...this.buttons.map((t=>t.imgs))),this.init(e)}initData(t){this.$set(this,"blocks",t.blocks||[]),this.$set(this,"prizes",t.prizes||[]),this.$set(this,"buttons",t.buttons||[]),this.$set(this,"defaultConfig",t.defaultConfig||{}),this.$set(this,"defaultStyle",t.defaultStyle||{}),this.$set(this,"startCallback",t.start),this.$set(this,"endCallback",t.end)}initComputed(){this.$computed(this,"_defaultConfig",(()=>({gutter:"0px",offsetDegree:0,speed:20,accelerationTime:2500,decelerationTime:2500,...this.defaultConfig}))),this.$computed(this,"_defaultStyle",(()=>({fontSize:"18px",fontColor:"#000",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",background:"#fff",wordWrap:!0,lengthLimit:"90%",...this.defaultStyle})))}initWatch(){this.$watch("prizes",((t,i)=>{let e=[];return i?t&&t.forEach(((t,s)=>{let h=[];const n=i[s];n?t.imgs&&t.imgs.forEach(((t,i)=>{if(!n.imgs)return h[i]=t;const e=n.imgs[i];e&&this.prizeImgs[s]&&this.prizeImgs[s][i]?t.src!==e.src&&(h[i]=t):h[i]=t})):h=t.imgs||[],e[s]=h})):e=t.map((t=>t.imgs)),this.init(e)})),this.$watch("buttons",((t,i)=>{let e=[];return i?t&&t.forEach(((t,s)=>{let h=[];const n=i[s];n&&n.imgs?t.imgs&&t.imgs.forEach(((t,i)=>{if(!n.imgs)return h[i]=t;const e=n.imgs[i];e&&this.btnImgs[s]&&this.btnImgs[s][i]?t.src!==e.src&&(h[i]=t):h[i]=t})):h=t.imgs||[],e[s]=h})):e=t.map((t=>t.imgs)),this.init([...new Array(this.prizes.length).fill(void 0),...e])}))}init(t){this.setDpr(),this.setHTMLFontSize();const{box:e,canvas:s,ctx:h,dpr:n}=this;if(!e)return;s.width=s.height=e.offsetWidth*n,this.Radius=s.width/2,this.optimizeClarity(s,2*this.Radius,2*this.Radius),h.translate(this.Radius,this.Radius);const r=()=>{this.draw(),s.onclick=t=>{h.beginPath(),h.arc(0,0,this.maxBtnRadius,0,2*Math.PI,!1),h.isPointInPath(t.offsetX,t.offsetY)&&(this.startTime||this.startCallback?.(t))}};let o=0,a=0;i(t,"array")&&(this.draw(),t.forEach(((t,i)=>{if(!t)return!1;t.forEach(((t,e)=>{a++,this.loadAndCacheImg(i,e,(()=>{o++,a===o&&r.call(this)}))}))}))),a||r.call(this)}loadAndCacheImg(t,i,e){const s=t<this.prizes.length,h=s?"prizes":"buttons",n=s?"prizeImgs":"btnImgs";t=s?t:t-this.prizes.length;const r=this[h][t];if(!r||!r.imgs)return;const o=r.imgs[i];if(!o)return;let a=new Image;this[n][t]||(this[n][t]=[]),this[n][t][i]=a,a.src=o.src,a.onload=()=>e.call(this)}computedWidthAndHeight(t,i,e,s){if(!i.width&&!i.height)return[t.width,t.height];if(i.width&&!i.height){let s=this.getWidth(i.width,e);return[s,t.height*(s/t.width)]}if(!i.width&&i.height){let e=this.getHeight(i.height,s);return[t.width*(e/t.height),e]}return[this.getWidth(i.width,e),this.getHeight(i.height,s)]}draw(){const{ctx:t,dpr:i,_defaultConfig:n,_defaultStyle:o}=this;t.clearRect(-this.Radius,-this.Radius,2*this.Radius,2*this.Radius),this.prizeRadius=this.blocks.reduce(((e,s)=>(t.beginPath(),t.fillStyle=s.background,t.arc(0,0,e,0,2*Math.PI,!1),t.fill(),e-this.getLength(s.padding.split(" ")[0])*i)),this.Radius),this.prizeDeg=360/this.prizes.length,this.prizeRadian=s(this.prizeDeg);let a=s(-90+this.rotateDeg+n.offsetDegree);const l=i=>this.getOffsetX(t.measureText(i).width),d=(t,e,s)=>{const h=t.lineHeight||o.lineHeight||t.fontSize||o.fontSize;return this.getHeight(t.top,e)+(s+1)*this.getLength(h)*i};t.save(),this.prizes.forEach(((c,g)=>{let f=a+g*this.prizeRadian,u=this.prizeRadius-this.maxBtnRadius;((t,i,e,n,o,a,l)=>{i||(i=a);let d=s(90/Math.PI/e*a),c=s(90/Math.PI/i*a),g=n+d,f=o-d,u=n+c,m=o-c;t.beginPath(),t.fillStyle=l,t.moveTo(...h(g,e)),r(t,e,g,f,!0),m>u?r(t,i,u,m,!1):t.lineTo(...h((n+o)/2,a/2/Math.abs(Math.sin((n-o)/2)))),t.closePath(),t.fill()})(t,this.maxBtnRadius,this.prizeRadius,f-this.prizeRadian/2,f+this.prizeRadian/2,this.getLength(n.gutter)*i,c.background||o.background||"rgba(0, 0, 0, 0)");let m=Math.cos(f)*this.prizeRadius,p=Math.sin(f)*this.prizeRadius;t.translate(m,p),t.rotate(f+s(90)),c.imgs&&c.imgs.forEach(((i,e)=>{if(!this.prizeImgs[g])return;const s=this.prizeImgs[g][e];if(!s)return;const[h,n]=this.computedWidthAndHeight(s,i,this.prizeRadian*this.prizeRadius,u);t.drawImage(s,this.getOffsetX(h),this.getHeight(i.top,u),h,n)})),c.fonts&&c.fonts.forEach((s=>{let h=s.fontColor||o.fontColor,r=s.fontWeight||o.fontWeight,a=this.getLength(s.fontSize||o.fontSize),c=s.fontStyle||o.fontStyle;t.fillStyle=h,t.font=`${r} ${a*i}px ${c}`;let g=[],f=String(s.text);if(s.hasOwnProperty("wordWrap")?s.wordWrap:o.wordWrap){f=e(f);let h="";for(let e=0;e<f.length;e++){h+=f[e];let r=t.measureText(h).width,a=(this.prizeRadius-d(s,u,g.length))*Math.tan(this.prizeRadian/2)*2-this.getLength(n.gutter)*i;r>this.getWidth(s.lengthLimit||o.lengthLimit,a)&&(g.push(h.slice(0,-1)),h=f[e])}h&&g.push(h),g.length||g.push(f)}else g=f.split("\n");g.filter((t=>!!t)).forEach(((i,e)=>{t.fillText(i,l(i),d(s,u,e))}))})),t.rotate(s(360)-f-s(90)),t.translate(-m,-p)})),t.restore(),this.buttons.forEach(((e,s)=>{let h=this.getHeight(e.radius);this.maxBtnRadius=Math.max(this.maxBtnRadius,h),t.beginPath(),t.fillStyle=e.background||"rgba(0, 0, 0, 0)",t.arc(0,0,h,0,2*Math.PI,!1),t.fill(),e.pointer&&(t.beginPath(),t.fillStyle=e.background||"rgba(0, 0, 0, 0)",t.moveTo(-h,0),t.lineTo(h,0),t.lineTo(0,2*-h),t.closePath(),t.fill()),e.imgs&&e.imgs.forEach(((i,n)=>{if(!this.btnImgs[s])return;const r=this.btnImgs[s][n];if(!r)return;const[o,a]=this.computedWidthAndHeight(r,i,2*this.getHeight(e.radius),2*this.getHeight(e.radius));t.drawImage(r,this.getOffsetX(o),this.getHeight(i.top,h),o,a)})),e.fonts&&e.fonts.forEach((e=>{let s=e.fontColor||o.fontColor,n=e.fontWeight||o.fontWeight,r=this.getLength(e.fontSize||o.fontSize),a=e.fontStyle||o.fontStyle;t.fillStyle=s,t.font=`${n} ${r*i}px ${a}`,String(e.text).split("\n").forEach(((i,s)=>{t.fillText(i,l(i),d(e,h,s))}))}))}))}play(){this.startTime||(cancelAnimationFrame(this.animationId),this.startTime=Date.now(),this.prizeFlag=void 0,this.run())}stop(t){this.prizeFlag=Number(t)%this.prizes.length}run(t=0){const{prizeFlag:i,prizeDeg:e,rotateDeg:s,_defaultConfig:h}=this;let n=Date.now()-this.startTime;if(n>=h.accelerationTime&&void 0!==i)return this.FPS=n/t,this.endTime=Date.now(),this.stopDeg=s,this.endDeg=1800-i*e-s-h.offsetDegree,cancelAnimationFrame(this.animationId),this.slowDown();this.rotateDeg=(s+a(n,0,h.speed,h.accelerationTime))%360,this.draw(),this.animationId=window.requestAnimationFrame(this.run.bind(this,t+1))}slowDown(){const{prizes:t,prizeFlag:i,stopDeg:e,endDeg:s,_defaultConfig:h}=this;let n=Date.now()-this.endTime;if(n>=h.decelerationTime)return this.startTime=0,this.endCallback?.({...t.find(((t,e)=>e===i))}),cancelAnimationFrame(this.animationId);this.rotateDeg=l(n,e,s,h.decelerationTime)%360,this.draw(),this.animationId=window.requestAnimationFrame(this.slowDown.bind(this))}getLength(t){return i(t,"number")?t:i(t,"string")?this.changeUnits(t,{clean:!0}):0}getWidth(t,e=this.prizeRadian*this.prizeRadius){return i(t,"number")?t*this.dpr:i(t,"string")?this.changeUnits(t,{denominator:e}):0}getHeight(t,e=this.prizeRadius){return i(t,"number")?t*this.dpr:i(t,"string")?this.changeUnits(t,{denominator:e}):0}getOffsetX(t){return-t/2}};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});class t{constructor(){this.htmlFontSize=16,this.dpr=1,this.subs={},this.setDpr(),this.setHTMLFontSize(),this.resetArrayPropo()}setDpr(){window.dpr=this.dpr=1.3*(window.devicePixelRatio||2)}setHTMLFontSize(){this.htmlFontSize=+getComputedStyle(document.documentElement).fontSize.slice(0,-2)}optimizeClarity(t,i,e){const{dpr:s}=this,h=t=>(t*s-t)/(t*s)*(s/2)*100;t.style.transform=`scale(${1/s}) translate(\n      ${-h(i)}%, ${-h(e)}%\n    )`}changeUnits(t,{denominator:i=1,clean:e=!1}){return Number(t.replace(/^(\-*[0-9.]*)([a-z%]*)$/,((t,s,h)=>{switch(h){case"%":s*=i/100;break;case"px":s*=1;break;case"rem":s*=this.htmlFontSize;break;default:s*=1}return e||"%"===h?s:s*this.dpr})))}draw(){}observer(t){t&&"object"==typeof t&&Object.keys(t).forEach((i=>{this.defineReactive(t,i,t[i])}))}defineReactive(t,i,e){this.observer(e),Object.defineProperty(t,i,{get:()=>e,set:t=>{let s=e;t!==e&&(e=t,this.observer(e),this.subs[i]&&this.subs[i].call(this,e,s),this.draw())}})}$set(t,i,e){t&&"object"==typeof t&&this.defineReactive(t,i,e)}$computed(t,i,e){Object.defineProperty(t,i,{get:()=>e.call(this)})}$watch(t,i){this.subs[t]=i}resetArrayPropo(){const t=this,i=Array.prototype,e=Object.create(i);["push","pop","shift","unshift","sort","splice","reverse"].forEach((s=>{e[s]=function(){t.draw(),i[s].call(this,...arguments)}}))}}const i=(t,...i)=>i.some((i=>Object.prototype.toString.call(t).slice(8,-1).toLowerCase()===i)),e=t=>[].filter.call(t,(t=>"\n"!==t)).join(""),s=t=>Math.PI/180*t,h=(t,i)=>[+(Math.cos(t)*i).toFixed(8),+(Math.sin(t)*i).toFixed(8)],n=(t,i)=>{let e=-t/i;return[e,-e*t+i]},r=(t,i,e,o,a=!0)=>{if(Math.abs(o-e).toFixed(8)>=s(180).toFixed(8)){let s=(o+e)/2;return a?(r(t,i,e,s,a),r(t,i,s,o,a)):(r(t,i,s,o,a),r(t,i,e,s,a)),!1}a||([e,o]=[o,e]);const[l,d]=h(e,i),[c,g]=h(o,i),[f,u]=n(l,d),[m,p]=n(c,g);let w=(p-u)/(f-m),b=(m*u-f*p)/(m-f);isNaN(w)&&(Math.abs(l)===+i.toFixed(8)&&(w=l),Math.abs(c)===+i.toFixed(8)&&(w=c)),f===1/0||f===-1/0?b=m*w+p:m!==1/0&&m!==-1/0||(b=f*w+u),t.lineTo(l,d),t.arcTo(w,b,c,g,i)},o=(t,i,e,s,h,n,r)=>{let o=Math.min(s,h);n>o/2&&(n=o/2),t.beginPath(),t.fillStyle=r,t.moveTo(i+n,e),t.lineTo(i+n,e),t.lineTo(i+s-n,e),t.arcTo(i+s,e,i+s,e+n,n),t.lineTo(i+s,e+h-n),t.arcTo(i+s,e+h,i+s-n,e+h,n),t.lineTo(i+n,e+h),t.arcTo(i,e+h,i,e+h-n,n),t.lineTo(i,e+n),t.arcTo(i,e,i+n,e,n),t.closePath(),t.fill()},a=function(t,i,e,s){return t>=s&&(t=s),e*(t/=s)*t+i},l=function(t,i,e,s){return t>=s&&(t=s),-e*(t/=s)*(t-2)+i};exports.LuckyGrid=class extends t{constructor(t,i={}){super(),this.rows=3,this.cols=3,this.blocks=[],this.prizes=[],this.defaultConfig={},this._defaultConfig={gutter:5,speed:20,accelerationTime:2500,decelerationTime:2500},this.defaultStyle={},this._defaultStyle={borderRadius:20,fontColor:"#000",fontSize:"18px",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",lineHeight:"",background:"#fff",shadow:"",wordWrap:!0,lengthLimit:"90%"},this.activeStyle={},this._activeStyle={background:"#ffce98",shadow:"",fontStyle:"",fontWeight:"",fontSize:"",lineHeight:"",fontColor:""},this.boxWidth=0,this.boxHeight=0,this.cellWidth=0,this.cellHeight=0,this.startTime=0,this.endTime=0,this.currIndex=0,this.stopIndex=0,this.endIndex=0,this.demo=!1,this.timer=0,this.animationId=0,this.FPS=16.6,this.cells=[],this.cellImgs=[],this.box=document.querySelector(t),this.canvas=document.createElement("canvas"),this.box.appendChild(this.canvas),this.ctx=this.canvas.getContext("2d"),this.initData(i),this.initComputed(),this.initWatch();let e=[[]];this.prizes&&(e=this.prizes.map((t=>t.imgs))),this.button&&(e[this.cols*this.rows-1]=this.button.imgs),this.init(e)}initData(t){this.$set(this,"rows",Number(t.rows)||3),this.$set(this,"cols",Number(t.cols)||3),this.$set(this,"blocks",t.blocks||[]),this.$set(this,"prizes",t.prizes||[]),this.$set(this,"button",t.button),this.$set(this,"defaultConfig",t.defaultConfig||{}),this.$set(this,"defaultStyle",t.defaultStyle||{}),this.$set(this,"activeStyle",t.activeStyle||{}),this.$set(this,"startCallback",t.start),this.$set(this,"endCallback",t.end)}initComputed(){this.$computed(this,"_defaultConfig",(()=>{const t={gutter:5,speed:20,accelerationTime:2500,decelerationTime:2500,...this.defaultConfig};return t.gutter=this.getLength(t.gutter)*this.dpr,t.speed=t.speed/40,t})),this.$computed(this,"_defaultStyle",(()=>({borderRadius:20,fontColor:"#000",fontSize:"18px",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",background:"#fff",shadow:"",wordWrap:!0,lengthLimit:"90%",...this.defaultStyle}))),this.$computed(this,"_activeStyle",(()=>({background:"#ffce98",shadow:"",...this.activeStyle})))}initWatch(){this.$watch("prizes",((t,i)=>{let e=[];return i?t&&t.forEach(((t,s)=>{let h=[];const n=i[s];n?t.imgs&&t.imgs.forEach(((t,i)=>{if(!n.imgs)return h[i]=t;const e=n.imgs[i];e&&this.cellImgs[s][i]?t.src!==e.src&&(h[i]=t):h[i]=t})):h=t.imgs||[],e[s]=h})):e=t.map((t=>t.imgs)),this.init(e)})),this.$watch("button",((t,i)=>{let e=[],s=this.cols*this.rows-1;if(i&&i.imgs){if(t.imgs){const h=[];t.imgs.forEach(((t,e)=>{if(!i.imgs)return h[e]=t;const n=i.imgs[e];n&&this.cellImgs[s][e]?t.src!==n.src&&(h[e]=t):h[e]=t})),e[s]=h}}else e[s]=t.imgs;return this.init(e)}))}init(t){this.setDpr(),this.setHTMLFontSize();const{box:e,canvas:s,dpr:h}=this;if(!e)return;this.boxWidth=s.width=e.offsetWidth*h,this.boxHeight=s.height=e.offsetHeight*h,this.optimizeClarity(s,this.boxWidth,this.boxHeight);const n=()=>{this.draw(),this.demo&&this.walk(),this.button&&(s.onclick=t=>{const[i,e,s,h]=this.getGeometricProperty([this.button.x,this.button.y,this.button.col||1,this.button.row||1]);if(t.offsetX<i||t.offsetY<e||t.offsetX>i+s||t.offsetY>e+h)return!1;this.startTime||this.startCallback?.(t)})};let r=0,o=0;i(t,"array")&&(this.draw(),t.forEach(((t,i)=>{if(!t)return!1;t.forEach(((t,e)=>{o++,this.loadAndCacheImg(i,e,(()=>{r++,o===r&&n.call(this)}))}))}))),o||n.call(this)}loadAndCacheImg(t,i,e){const s=this.cells[t];if(!s||!s.imgs)return;const h=s.imgs[i];this.cellImgs[t]||(this.cellImgs[t]=[]);let n=new Image;this.cellImgs[t][i]={defaultImg:n},n.src=h.src;let r=0,o=1;if(n.onload=()=>{r++,r===o&&e.call(this)},!h.hasOwnProperty("activeSrc"))return;o++;let a=new Image;this.cellImgs[t][i].activeImg=a,a.src=h.activeSrc,a.onload=()=>{r++,r===o&&e.call(this)}}computedWidthAndHeight(t,i,e){if(!i.width&&!i.height)return[t.width,t.height];if(i.width&&!i.height){let s=this.getWidth(i.width,e.col);return[s,t.height*(s/t.width)]}if(!i.width&&i.height){let s=this.getHeight(i.height,e.row);return[t.width*(s/t.height),s]}return[this.getWidth(i.width,e.col),this.getHeight(i.height,e.row)]}draw(){const{ctx:t,dpr:s,_defaultConfig:h,_defaultStyle:n,_activeStyle:r}=this;t.clearRect(0,0,this.boxWidth,this.boxWidth),this.cells=[...this.prizes],this.button&&(this.cells[this.cols*this.rows-1]=this.button),this.cells.forEach((t=>{t.col=t.col||1,t.row=t.row||1})),this.prizeArea=this.blocks.reduce((({x:e,y:h,w:n,h:r},a)=>{const[l,d,c,g]=(t=>{let e=t.padding.replace(/px/g,"").split(" ").map((t=>~~t))||[0],s=0,h=0,n=0,r=0;switch(e.length){case 1:s=h=n=r=e[0];break;case 2:s=h=e[0],n=r=e[1];break;case 3:s=e[0],n=r=e[1],h=e[2];break;default:s=e[0],h=e[1],n=e[2],r=e[3]}const o={paddingTop:s,paddingBottom:h,paddingLeft:n,paddingRight:r};for(let e in o)o[e]=t.hasOwnProperty(e)&&i(t[e],"string","number")?~~String(t[e]).replace(/px/g,""):o[e];return[s,h,n,r]})(a).map((t=>t*s)),f=a.borderRadius?this.getLength(a.borderRadius)*s:0;return o(t,e,h,n,r,f,this.handleBackground(e,h,n,r,a.background)),{x:e+c,y:h+l,w:n-c-g,h:r-l-d}}),{x:0,y:0,w:this.boxWidth,h:this.boxHeight}),this.cellWidth=(this.prizeArea.w-h.gutter*(this.cols-1))/this.cols,this.cellHeight=(this.prizeArea.h-h.gutter*(this.rows-1))/this.rows,this.cells.forEach(((i,h)=>{let[a,l,d,c]=this.getGeometricProperty([i.x,i.y,i.col,i.row]);const g=h===this.currIndex%this.prizes.length>>0,f=(g?r.shadow:i.shadow||n.shadow).replace(/px/g,"").split(",")[0].split(" ").map(((t,i)=>i<3?Number(t)*s:t));4===f.length&&(t.shadowColor=f[3],t.shadowOffsetX=f[0],t.shadowOffsetY=f[1],t.shadowBlur=f[2],f[0]>0?d-=f[0]:(d+=f[0],a-=f[0]),f[1]>0?c-=f[1]:(c+=f[1],l-=f[1])),o(t,a,l,d,c,this.getLength(i.borderRadius?i.borderRadius:n.borderRadius)*s,this.handleBackground(a,l,d,c,i.background,g)),t.shadowColor="rgba(255, 255, 255, 0)",t.shadowOffsetX=0,t.shadowOffsetY=0,t.shadowBlur=0,i.imgs&&i.imgs.forEach(((e,s)=>{if(!this.cellImgs[h])return!1;const n=this.cellImgs[h][s];if(!n)return!1;const r=g&&n.activeImg||n.defaultImg,[o,d]=this.computedWidthAndHeight(r,e,i);t.drawImage(r,a+this.getOffsetX(o,i.col),l+this.getHeight(e.top,i.row),o,d)})),i.fonts&&i.fonts.forEach((h=>{let o=g&&r.fontStyle?r.fontStyle:h.fontStyle||n.fontStyle,d=g&&r.fontWeight?r.fontWeight:h.fontWeight||n.fontWeight,c=g&&r.fontSize?this.getLength(r.fontSize):this.getLength(h.fontSize||n.fontSize);const f=g&&r.lineHeight?r.lineHeight:h.lineHeight||n.lineHeight||h.fontSize||n.fontSize;t.font=`${d} ${c*s}px ${o}`,t.fillStyle=g&&r.fontColor?r.fontColor:h.fontColor||n.fontColor;let u=[],m=String(h.text);if(h.hasOwnProperty("wordWrap")?h.wordWrap:n.wordWrap){m=e(m);let s="";for(let e=0;e<m.length;e++){s+=m[e],t.measureText(s).width>this.getWidth(h.lengthLimit||n.lengthLimit,i.col)&&(u.push(s.slice(0,-1)),s=m[e])}s&&u.push(s),u.length||u.push(m)}else u=m.split("\n");u.forEach(((e,n)=>{t.fillText(e,a+this.getOffsetX(t.measureText(e).width,i.col),l+this.getHeight(h.top,i.row)+(n+1)*this.getLength(f)*s)}))}))}))}handleBackground(t,i,e,s,h,n=!1){const{ctx:r,_defaultStyle:o,_activeStyle:a}=this;return(h=n?a.background:h||o.background).includes("linear-gradient")&&(h=((t,i,e,s,h,n)=>{const r=/linear-gradient\((.+)\)/.exec(n)[1].split(",").map((t=>t.trim()));let o=r.shift(),a=[0,0,0,0];if(o.includes("deg")){o=o.slice(0,-3)%360;const t=t=>Math.tan(t/180*Math.PI);o>=0&&o<45?a=[i,e+h,i+s,e+h-s*t(o-0)]:o>=45&&o<90?a=[i,e+h,i+s-h*t(o-45),e]:o>=90&&o<135?a=[i+s,e+h,i+s-h*t(o-90),e]:o>=135&&o<180?a=[i+s,e+h,i,e+s*t(o-135)]:o>=180&&o<225?a=[i+s,e,i,e+s*t(o-180)]:o>=225&&o<270?a=[i+s,e,i+h*t(o-225),e+h]:o>=270&&o<315?a=[i,e,i+h*t(o-270),e+h]:o>=315&&o<360&&(a=[i,e,i+s,e+h-s*t(o-315)])}else o.includes("top")?a=[i,e+h,i,e]:o.includes("bottom")?a=[i,e,i,e+h]:o.includes("left")?a=[i+s,e,i,e]:o.includes("right")&&(a=[i,e,i+s,e]);const l=t.createLinearGradient(...a.map((t=>t>>0)));return r.reduce(((t,i,e)=>{const s=i.split(" ");return 1===s.length?t.addColorStop(e,s[0]):2===s.length&&t.addColorStop(...s),t}),l)})(r,t,i,e,s,h)),h}play(){this.startTime||(clearInterval(this.timer),cancelAnimationFrame(this.animationId),this.startTime=Date.now(),this.prizeFlag=void 0,this.run())}stop(t){this.prizeFlag=t%this.prizes.length}run(t=0){const{currIndex:i,prizes:e,prizeFlag:s,startTime:h,_defaultConfig:n}=this;let r=Date.now()-h;if(r>=n.accelerationTime&&void 0!==s){this.FPS=r/t,this.endTime=Date.now(),this.stopIndex=i;let h=0;for(;++h;){const t=e.length*h+s-(i>>0);if(l(this.FPS,this.stopIndex,t,n.decelerationTime)-this.stopIndex>n.speed){this.endIndex=t;break}}return cancelAnimationFrame(this.animationId),this.slowDown()}this.currIndex=(i+a(r,.1,n.speed,n.accelerationTime))%e.length,this.draw(),this.animationId=window.requestAnimationFrame(this.run.bind(this,t+1))}slowDown(){const{prizes:t,prizeFlag:i,stopIndex:e,endIndex:s,_defaultConfig:h}=this;let n=Date.now()-this.endTime;if(n>h.decelerationTime)return this.startTime=0,this.endCallback?.({...t.find(((t,e)=>e===i))}),cancelAnimationFrame(this.animationId);this.currIndex=l(n,e,s,h.decelerationTime)%t.length,this.draw(),this.animationId=window.requestAnimationFrame(this.slowDown.bind(this))}walk(){clearInterval(this.timer),this.timer=window.setInterval((()=>{this.currIndex+=1,this.draw()}),1300)}getGeometricProperty([t,i,e,s]){const{cellWidth:h,cellHeight:n}=this,r=this._defaultConfig.gutter;let o=[this.prizeArea.x+(h+r)*t,this.prizeArea.y+(n+r)*i];return e&&s&&o.push(h*e+r*(e-1),n*s+r*(s-1)),o}getLength(t){return i(t,"number")?t:i(t,"string")?this.changeUnits(t,{clean:!0}):0}getWidth(t,e=1){return i(t,"number")?t*this.dpr:i(t,"string")?this.changeUnits(t,{denominator:this.cellWidth*e+this._defaultConfig.gutter*(e-1)}):0}getHeight(t,e=1){return i(t,"number")?t*this.dpr:i(t,"string")?this.changeUnits(t,{denominator:this.cellHeight*e+this._defaultConfig.gutter*(e-1)}):0}getOffsetX(t,i=1){return(this.cellWidth*i+this._defaultConfig.gutter*(i-1)-t)/2}},exports.LuckyWheel=class extends t{constructor(t,i={}){super(),this.blocks=[],this.prizes=[],this.buttons=[],this.defaultConfig={},this._defaultConfig={gutter:"0px",offsetDegree:0,speed:20,accelerationTime:2500,decelerationTime:2500},this.defaultStyle={},this._defaultStyle={fontSize:"18px",fontColor:"#000",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",lineHeight:"",background:"#fff",wordWrap:!0,lengthLimit:"90%"},this.Radius=0,this.prizeRadius=0,this.prizeDeg=0,this.prizeRadian=0,this.rotateDeg=0,this.maxBtnRadius=0,this.startTime=0,this.endTime=0,this.stopDeg=0,this.endDeg=0,this.animationId=0,this.FPS=16.6,this.prizeImgs=[[]],this.btnImgs=[[]],this.box=document.querySelector(t),this.canvas=document.createElement("canvas"),this.box.appendChild(this.canvas),this.ctx=this.canvas.getContext("2d"),this.initData(i),this.initComputed(),this.initWatch();let e=[[]];this.prizes&&(e=this.prizes.map((t=>t.imgs))),this.buttons&&e.push(...this.buttons.map((t=>t.imgs))),this.init(e)}initData(t){this.$set(this,"blocks",t.blocks||[]),this.$set(this,"prizes",t.prizes||[]),this.$set(this,"buttons",t.buttons||[]),this.$set(this,"defaultConfig",t.defaultConfig||{}),this.$set(this,"defaultStyle",t.defaultStyle||{}),this.$set(this,"startCallback",t.start),this.$set(this,"endCallback",t.end)}initComputed(){this.$computed(this,"_defaultConfig",(()=>({gutter:"0px",offsetDegree:0,speed:20,accelerationTime:2500,decelerationTime:2500,...this.defaultConfig}))),this.$computed(this,"_defaultStyle",(()=>({fontSize:"18px",fontColor:"#000",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",background:"#fff",wordWrap:!0,lengthLimit:"90%",...this.defaultStyle})))}initWatch(){this.$watch("prizes",((t,i)=>{let e=[];return i?t&&t.forEach(((t,s)=>{let h=[];const n=i[s];n?t.imgs&&t.imgs.forEach(((t,i)=>{if(!n.imgs)return h[i]=t;const e=n.imgs[i];e&&this.prizeImgs[s]&&this.prizeImgs[s][i]?t.src!==e.src&&(h[i]=t):h[i]=t})):h=t.imgs||[],e[s]=h})):e=t.map((t=>t.imgs)),this.init(e)})),this.$watch("buttons",((t,i)=>{let e=[];return i?t&&t.forEach(((t,s)=>{let h=[];const n=i[s];n&&n.imgs?t.imgs&&t.imgs.forEach(((t,i)=>{if(!n.imgs)return h[i]=t;const e=n.imgs[i];e&&this.btnImgs[s]&&this.btnImgs[s][i]?t.src!==e.src&&(h[i]=t):h[i]=t})):h=t.imgs||[],e[s]=h})):e=t.map((t=>t.imgs)),this.init([...new Array(this.prizes.length).fill(void 0),...e])}))}init(t){this.setDpr(),this.setHTMLFontSize();const{box:e,canvas:s,ctx:h,dpr:n}=this;if(!e)return;s.width=s.height=e.offsetWidth*n,this.Radius=s.width/2,this.optimizeClarity(s,2*this.Radius,2*this.Radius),h.translate(this.Radius,this.Radius);const r=()=>{this.draw(),s.onclick=t=>{h.beginPath(),h.arc(0,0,this.maxBtnRadius,0,2*Math.PI,!1),h.isPointInPath(t.offsetX,t.offsetY)&&(this.startTime||this.startCallback?.(t))}};let o=0,a=0;i(t,"array")&&(this.draw(),t.forEach(((t,i)=>{if(!t)return!1;t.forEach(((t,e)=>{a++,this.loadAndCacheImg(i,e,(()=>{o++,a===o&&r.call(this)}))}))}))),a||r.call(this)}loadAndCacheImg(t,i,e){const s=t<this.prizes.length,h=s?"prizes":"buttons",n=s?"prizeImgs":"btnImgs";t=s?t:t-this.prizes.length;const r=this[h][t];if(!r||!r.imgs)return;const o=r.imgs[i];if(!o)return;let a=new Image;this[n][t]||(this[n][t]=[]),this[n][t][i]=a,a.src=o.src,a.onload=()=>e.call(this)}computedWidthAndHeight(t,i,e,s){if(!i.width&&!i.height)return[t.width,t.height];if(i.width&&!i.height){let s=this.getWidth(i.width,e);return[s,t.height*(s/t.width)]}if(!i.width&&i.height){let e=this.getHeight(i.height,s);return[t.width*(e/t.height),e]}return[this.getWidth(i.width,e),this.getHeight(i.height,s)]}draw(){const{ctx:t,dpr:i,_defaultConfig:n,_defaultStyle:o}=this;t.clearRect(-this.Radius,-this.Radius,2*this.Radius,2*this.Radius),this.prizeRadius=this.blocks.reduce(((e,s)=>(t.beginPath(),t.fillStyle=s.background,t.arc(0,0,e,0,2*Math.PI,!1),t.fill(),e-this.getLength(s.padding.split(" ")[0])*i)),this.Radius),this.prizeDeg=360/this.prizes.length,this.prizeRadian=s(this.prizeDeg);let a=s(-90+this.rotateDeg+n.offsetDegree);const l=i=>this.getOffsetX(t.measureText(i).width),d=(t,e,s)=>{const h=t.lineHeight||o.lineHeight||t.fontSize||o.fontSize;return this.getHeight(t.top,e)+(s+1)*this.getLength(h)*i};t.save(),this.prizes.forEach(((c,g)=>{let f=a+g*this.prizeRadian,u=this.prizeRadius-this.maxBtnRadius;((t,i,e,n,o,a,l)=>{i||(i=a);let d=s(90/Math.PI/e*a),c=s(90/Math.PI/i*a),g=n+d,f=o-d,u=n+c,m=o-c;t.beginPath(),t.fillStyle=l,t.moveTo(...h(g,e)),r(t,e,g,f,!0),m>u?r(t,i,u,m,!1):t.lineTo(...h((n+o)/2,a/2/Math.abs(Math.sin((n-o)/2)))),t.closePath(),t.fill()})(t,this.maxBtnRadius,this.prizeRadius,f-this.prizeRadian/2,f+this.prizeRadian/2,this.getLength(n.gutter)*i,c.background||o.background||"rgba(0, 0, 0, 0)");let m=Math.cos(f)*this.prizeRadius,p=Math.sin(f)*this.prizeRadius;t.translate(m,p),t.rotate(f+s(90)),c.imgs&&c.imgs.forEach(((i,e)=>{if(!this.prizeImgs[g])return;const s=this.prizeImgs[g][e];if(!s)return;const[h,n]=this.computedWidthAndHeight(s,i,this.prizeRadian*this.prizeRadius,u);t.drawImage(s,this.getOffsetX(h),this.getHeight(i.top,u),h,n)})),c.fonts&&c.fonts.forEach((s=>{let h=s.fontColor||o.fontColor,r=s.fontWeight||o.fontWeight,a=this.getLength(s.fontSize||o.fontSize),c=s.fontStyle||o.fontStyle;t.fillStyle=h,t.font=`${r} ${a*i}px ${c}`;let g=[],f=String(s.text);if(s.hasOwnProperty("wordWrap")?s.wordWrap:o.wordWrap){f=e(f);let h="";for(let e=0;e<f.length;e++){h+=f[e];let r=t.measureText(h).width,a=(this.prizeRadius-d(s,u,g.length))*Math.tan(this.prizeRadian/2)*2-this.getLength(n.gutter)*i;r>this.getWidth(s.lengthLimit||o.lengthLimit,a)&&(g.push(h.slice(0,-1)),h=f[e])}h&&g.push(h),g.length||g.push(f)}else g=f.split("\n");g.filter((t=>!!t)).forEach(((i,e)=>{t.fillText(i,l(i),d(s,u,e))}))})),t.rotate(s(360)-f-s(90)),t.translate(-m,-p)})),t.restore(),this.buttons.forEach(((e,s)=>{let h=this.getHeight(e.radius);this.maxBtnRadius=Math.max(this.maxBtnRadius,h),t.beginPath(),t.fillStyle=e.background||"rgba(0, 0, 0, 0)",t.arc(0,0,h,0,2*Math.PI,!1),t.fill(),e.pointer&&(t.beginPath(),t.fillStyle=e.background||"rgba(0, 0, 0, 0)",t.moveTo(-h,0),t.lineTo(h,0),t.lineTo(0,2*-h),t.closePath(),t.fill()),e.imgs&&e.imgs.forEach(((i,n)=>{if(!this.btnImgs[s])return;const r=this.btnImgs[s][n];if(!r)return;const[o,a]=this.computedWidthAndHeight(r,i,2*this.getHeight(e.radius),2*this.getHeight(e.radius));t.drawImage(r,this.getOffsetX(o),this.getHeight(i.top,h),o,a)})),e.fonts&&e.fonts.forEach((e=>{let s=e.fontColor||o.fontColor,n=e.fontWeight||o.fontWeight,r=this.getLength(e.fontSize||o.fontSize),a=e.fontStyle||o.fontStyle;t.fillStyle=s,t.font=`${n} ${r*i}px ${a}`,String(e.text).split("\n").forEach(((i,s)=>{t.fillText(i,l(i),d(e,h,s))}))}))}))}play(){this.startTime||(cancelAnimationFrame(this.animationId),this.startTime=Date.now(),this.prizeFlag=void 0,this.run())}stop(t){this.prizeFlag=Number(t)%this.prizes.length}run(t=0){const{prizeFlag:i,prizeDeg:e,rotateDeg:s,_defaultConfig:h}=this;let n=Date.now()-this.startTime;if(n>=h.accelerationTime&&void 0!==i){this.FPS=n/t,this.endTime=Date.now(),this.stopDeg=s;let r=0;for(;++r;){const t=360*r-i*e-s-h.offsetDegree;if(l(this.FPS,this.stopDeg,t,h.decelerationTime)-this.stopDeg>h.speed){this.endDeg=t;break}}return cancelAnimationFrame(this.animationId),this.slowDown()}this.rotateDeg=(s+a(n,0,h.speed,h.accelerationTime))%360,this.draw(),this.animationId=window.requestAnimationFrame(this.run.bind(this,t+1))}slowDown(){const{prizes:t,prizeFlag:i,stopDeg:e,endDeg:s,_defaultConfig:h}=this;let n=Date.now()-this.endTime;if(n>=h.decelerationTime)return this.startTime=0,this.endCallback?.({...t.find(((t,e)=>e===i))}),cancelAnimationFrame(this.animationId);this.rotateDeg=l(n,e,s,h.decelerationTime)%360,this.draw(),this.animationId=window.requestAnimationFrame(this.slowDown.bind(this))}getLength(t){return i(t,"number")?t:i(t,"string")?this.changeUnits(t,{clean:!0}):0}getWidth(t,e=this.prizeRadian*this.prizeRadius){return i(t,"number")?t*this.dpr:i(t,"string")?this.changeUnits(t,{denominator:e}):0}getHeight(t,e=this.prizeRadius){return i(t,"number")?t*this.dpr:i(t,"string")?this.changeUnits(t,{denominator:e}):0}getOffsetX(t){return-t/2}};

dist/lucky-canvas.umd.min.js

@@ -1,1 +0,1 @@
-!function(t,i){"object"==typeof exports&&"undefined"!=typeof module?i(exports):"function"==typeof define&&define.amd?define(["exports"],i):i((t="undefined"!=typeof globalThis?globalThis:t||self).LuckyCanvas={})}(this,(function(t){"use strict";class i{constructor(){this.htmlFontSize=16,this.dpr=1,this.subs={},this.setDpr(),this.setHTMLFontSize(),this.resetArrayPropo()}setDpr(){window.dpr=this.dpr=1.3*(window.devicePixelRatio||2)}setHTMLFontSize(){this.htmlFontSize=+getComputedStyle(document.documentElement).fontSize.slice(0,-2)}optimizeClarity(t,i,e){const{dpr:s}=this,h=t=>(t*s-t)/(t*s)*(s/2)*100;t.style.transform=`scale(${1/s}) translate(\n      ${-h(i)}%, ${-h(e)}%\n    )`}changeUnits(t,{denominator:i=1,clean:e=!1}){return Number(t.replace(/^(\-*[0-9.]*)([a-z%]*)$/,((t,s,h)=>{switch(h){case"%":s*=i/100;break;case"px":s*=1;break;case"rem":s*=this.htmlFontSize;break;default:s*=1}return e||"%"===h?s:s*this.dpr})))}draw(){}observer(t){t&&"object"==typeof t&&Object.keys(t).forEach((i=>{this.defineReactive(t,i,t[i])}))}defineReactive(t,i,e){this.observer(e),Object.defineProperty(t,i,{get:()=>e,set:t=>{let s=e;t!==e&&(e=t,this.observer(e),this.subs[i]&&this.subs[i].call(this,e,s),this.draw())}})}$set(t,i,e){t&&"object"==typeof t&&this.defineReactive(t,i,e)}$computed(t,i,e){Object.defineProperty(t,i,{get:()=>e.call(this)})}$watch(t,i){this.subs[t]=i}resetArrayPropo(){const t=this,i=Array.prototype,e=Object.create(i);["push","pop","shift","unshift","sort","splice","reverse"].forEach((s=>{e[s]=function(){t.draw(),i[s].call(this,...arguments)}}))}}const e=(t,...i)=>i.some((i=>Object.prototype.toString.call(t).slice(8,-1).toLowerCase()===i)),s=t=>[].filter.call(t,(t=>"\n"!==t)).join(""),h=t=>Math.PI/180*t,n=(t,i)=>[+(Math.cos(t)*i).toFixed(8),+(Math.sin(t)*i).toFixed(8)],r=(t,i)=>{let e=-t/i;return[e,-e*t+i]},o=(t,i,e,s,a=!0)=>{if(Math.abs(s-e).toFixed(8)>=h(180).toFixed(8)){let h=(s+e)/2;return a?(o(t,i,e,h,a),o(t,i,h,s,a)):(o(t,i,h,s,a),o(t,i,e,h,a)),!1}a||([e,s]=[s,e]);const[l,d]=n(e,i),[c,g]=n(s,i),[f,u]=r(l,d),[m,p]=r(c,g);let w=(p-u)/(f-m),b=(m*u-f*p)/(m-f);isNaN(w)&&(Math.abs(l)===+i.toFixed(8)&&(w=l),Math.abs(c)===+i.toFixed(8)&&(w=c)),f===1/0||f===-1/0?b=m*w+p:m!==1/0&&m!==-1/0||(b=f*w+u),t.lineTo(l,d),t.arcTo(w,b,c,g,i)},a=(t,i,e,s,h,n,r)=>{let o=Math.min(s,h);n>o/2&&(n=o/2),t.beginPath(),t.fillStyle=r,t.moveTo(i+n,e),t.lineTo(i+n,e),t.lineTo(i+s-n,e),t.arcTo(i+s,e,i+s,e+n,n),t.lineTo(i+s,e+h-n),t.arcTo(i+s,e+h,i+s-n,e+h,n),t.lineTo(i+n,e+h),t.arcTo(i,e+h,i,e+h-n,n),t.lineTo(i,e+n),t.arcTo(i,e,i+n,e,n),t.closePath(),t.fill()},l=function(t,i,e,s){return t>=s&&(t=s),e*(t/=s)*t+i},d=function(t,i,e,s){return t>=s&&(t=s),-e*(t/=s)*(t-2)+i};t.LuckyGrid=class extends i{constructor(t,i={}){super(),this.rows=3,this.cols=3,this.blocks=[],this.prizes=[],this.defaultConfig={},this._defaultConfig={gutter:5,speed:20,accelerationTime:2500,decelerationTime:2500},this.defaultStyle={},this._defaultStyle={borderRadius:20,fontColor:"#000",fontSize:"18px",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",lineHeight:"",background:"#fff",shadow:"",wordWrap:!0,lengthLimit:"90%"},this.activeStyle={},this._activeStyle={background:"#ffce98",shadow:"",fontStyle:"",fontWeight:"",fontSize:"",lineHeight:"",fontColor:""},this.boxWidth=0,this.boxHeight=0,this.cellWidth=0,this.cellHeight=0,this.startTime=0,this.endTime=0,this.currIndex=0,this.stopIndex=0,this.endIndex=0,this.demo=!1,this.timer=0,this.animationId=0,this.FPS=16.6,this.cells=[],this.cellImgs=[],this.box=document.querySelector(t),this.canvas=document.createElement("canvas"),this.box.appendChild(this.canvas),this.ctx=this.canvas.getContext("2d"),this.initData(i),this.initComputed(),this.initWatch();let e=[[]];this.prizes&&(e=this.prizes.map((t=>t.imgs))),this.button&&(e[this.cols*this.rows-1]=this.button.imgs),this.init(e)}initData(t){this.$set(this,"rows",Number(t.rows)||3),this.$set(this,"cols",Number(t.cols)||3),this.$set(this,"blocks",t.blocks||[]),this.$set(this,"prizes",t.prizes||[]),this.$set(this,"button",t.button),this.$set(this,"defaultConfig",t.defaultConfig||{}),this.$set(this,"defaultStyle",t.defaultStyle||{}),this.$set(this,"activeStyle",t.activeStyle||{}),this.$set(this,"startCallback",t.start),this.$set(this,"endCallback",t.end)}initComputed(){this.$computed(this,"_defaultConfig",(()=>{const t={gutter:5,speed:20,accelerationTime:2500,decelerationTime:2500,...this.defaultConfig};return t.gutter=this.getLength(t.gutter)*this.dpr,t.speed=t.speed/40,t})),this.$computed(this,"_defaultStyle",(()=>({borderRadius:20,fontColor:"#000",fontSize:"18px",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",background:"#fff",shadow:"",wordWrap:!0,lengthLimit:"90%",...this.defaultStyle}))),this.$computed(this,"_activeStyle",(()=>({background:"#ffce98",shadow:"",...this.activeStyle})))}initWatch(){this.$watch("prizes",((t,i)=>{let e=[];return i?t&&t.forEach(((t,s)=>{let h=[];const n=i[s];n?t.imgs&&t.imgs.forEach(((t,i)=>{if(!n.imgs)return h[i]=t;const e=n.imgs[i];e&&this.cellImgs[s][i]?t.src!==e.src&&(h[i]=t):h[i]=t})):h=t.imgs||[],e[s]=h})):e=t.map((t=>t.imgs)),this.init(e)})),this.$watch("button",((t,i)=>{let e=[],s=this.cols*this.rows-1;if(i&&i.imgs){if(t.imgs){const h=[];t.imgs.forEach(((t,e)=>{if(!i.imgs)return h[e]=t;const n=i.imgs[e];n&&this.cellImgs[s][e]?t.src!==n.src&&(h[e]=t):h[e]=t})),e[s]=h}}else e[s]=t.imgs;return this.init(e)}))}init(t){this.setDpr(),this.setHTMLFontSize();const{box:i,canvas:s,dpr:h}=this;if(!i)return;this.boxWidth=s.width=i.offsetWidth*h,this.boxHeight=s.height=i.offsetHeight*h,this.optimizeClarity(s,this.boxWidth,this.boxHeight);const n=()=>{this.draw(),this.demo&&this.walk(),this.button&&(s.onclick=t=>{const[i,e,s,h]=this.getGeometricProperty([this.button.x,this.button.y,this.button.col||1,this.button.row||1]);if(t.offsetX<i||t.offsetY<e||t.offsetX>i+s||t.offsetY>e+h)return!1;this.startTime||this.startCallback?.(t)})};let r=0,o=0;e(t,"array")&&(this.draw(),t.forEach(((t,i)=>{if(!t)return!1;t.forEach(((t,e)=>{o++,this.loadAndCacheImg(i,e,(()=>{r++,o===r&&n.call(this)}))}))}))),o||n.call(this)}loadAndCacheImg(t,i,e){const s=this.cells[t];if(!s||!s.imgs)return;const h=s.imgs[i];this.cellImgs[t]||(this.cellImgs[t]=[]);let n=new Image;this.cellImgs[t][i]={defaultImg:n},n.src=h.src;let r=0,o=1;if(n.onload=()=>{r++,r===o&&e.call(this)},!h.hasOwnProperty("activeSrc"))return;o++;let a=new Image;this.cellImgs[t][i].activeImg=a,a.src=h.activeSrc,a.onload=()=>{r++,r===o&&e.call(this)}}computedWidthAndHeight(t,i,e){if(!i.width&&!i.height)return[t.width,t.height];if(i.width&&!i.height){let s=this.getWidth(i.width,e.col);return[s,t.height*(s/t.width)]}if(!i.width&&i.height){let s=this.getHeight(i.height,e.row);return[t.width*(s/t.height),s]}return[this.getWidth(i.width,e.col),this.getHeight(i.height,e.row)]}draw(){const{ctx:t,dpr:i,_defaultConfig:h,_defaultStyle:n,_activeStyle:r}=this;t.clearRect(0,0,this.boxWidth,this.boxWidth),this.cells=[...this.prizes],this.button&&(this.cells[this.cols*this.rows-1]=this.button),this.cells.forEach((t=>{t.col=t.col||1,t.row=t.row||1})),this.prizeArea=this.blocks.reduce((({x:s,y:h,w:n,h:r},o)=>{const[l,d,c,g]=(t=>{let i=t.padding.replace(/px/g,"").split(" ").map((t=>~~t))||[0],s=0,h=0,n=0,r=0;switch(i.length){case 1:s=h=n=r=i[0];break;case 2:s=h=i[0],n=r=i[1];break;case 3:s=i[0],n=r=i[1],h=i[2];break;default:s=i[0],h=i[1],n=i[2],r=i[3]}const o={paddingTop:s,paddingBottom:h,paddingLeft:n,paddingRight:r};for(let i in o)o[i]=t.hasOwnProperty(i)&&e(t[i],"string","number")?~~String(t[i]).replace(/px/g,""):o[i];return[s,h,n,r]})(o).map((t=>t*i)),f=o.borderRadius?this.getLength(o.borderRadius)*i:0;return a(t,s,h,n,r,f,this.handleBackground(s,h,n,r,o.background)),{x:s+c,y:h+l,w:n-c-g,h:r-l-d}}),{x:0,y:0,w:this.boxWidth,h:this.boxHeight}),this.cellWidth=(this.prizeArea.w-h.gutter*(this.cols-1))/this.cols,this.cellHeight=(this.prizeArea.h-h.gutter*(this.rows-1))/this.rows,this.cells.forEach(((e,h)=>{let[o,l,d,c]=this.getGeometricProperty([e.x,e.y,e.col,e.row]);const g=h===this.currIndex%this.prizes.length>>0,f=(g?r.shadow:e.shadow||n.shadow).replace(/px/g,"").split(",")[0].split(" ").map(((t,e)=>e<3?Number(t)*i:t));4===f.length&&(t.shadowColor=f[3],t.shadowOffsetX=f[0],t.shadowOffsetY=f[1],t.shadowBlur=f[2],f[0]>0?d-=f[0]:(d+=f[0],o-=f[0]),f[1]>0?c-=f[1]:(c+=f[1],l-=f[1])),a(t,o,l,d,c,this.getLength(e.borderRadius?e.borderRadius:n.borderRadius)*i,this.handleBackground(o,l,d,c,e.background,g)),t.shadowColor="rgba(255, 255, 255, 0)",t.shadowOffsetX=0,t.shadowOffsetY=0,t.shadowBlur=0,e.imgs&&e.imgs.forEach(((i,s)=>{if(!this.cellImgs[h])return!1;const n=this.cellImgs[h][s];if(!n)return!1;const r=g&&n.activeImg||n.defaultImg,[a,d]=this.computedWidthAndHeight(r,i,e);t.drawImage(r,o+this.getOffsetX(a,e.col),l+this.getHeight(i.top,e.row),a,d)})),e.fonts&&e.fonts.forEach((h=>{let a=g&&r.fontStyle?r.fontStyle:h.fontStyle||n.fontStyle,d=g&&r.fontWeight?r.fontWeight:h.fontWeight||n.fontWeight,c=g&&r.fontSize?this.getLength(r.fontSize):this.getLength(h.fontSize||n.fontSize);const f=g&&r.lineHeight?r.lineHeight:h.lineHeight||n.lineHeight||h.fontSize||n.fontSize;t.font=`${d} ${c*i}px ${a}`,t.fillStyle=g&&r.fontColor?r.fontColor:h.fontColor||n.fontColor;let u=[],m=String(h.text);if(h.hasOwnProperty("wordWrap")?h.wordWrap:n.wordWrap){m=s(m);let i="";for(let s=0;s<m.length;s++){i+=m[s],t.measureText(i).width>this.getWidth(h.lengthLimit||n.lengthLimit,e.col)&&(u.push(i.slice(0,-1)),i=m[s])}i&&u.push(i),u.length||u.push(m)}else u=m.split("\n");u.forEach(((s,n)=>{t.fillText(s,o+this.getOffsetX(t.measureText(s).width,e.col),l+this.getHeight(h.top,e.row)+(n+1)*this.getLength(f)*i)}))}))}))}handleBackground(t,i,e,s,h,n=!1){const{ctx:r,_defaultStyle:o,_activeStyle:a}=this;return(h=n?a.background:h||o.background).includes("linear-gradient")&&(h=((t,i,e,s,h,n)=>{const r=/linear-gradient\((.+)\)/.exec(n)[1].split(",").map((t=>t.trim()));let o=r.shift(),a=[0,0,0,0];if(o.includes("deg")){o=o.slice(0,-3)%360;const t=t=>Math.tan(t/180*Math.PI);o>=0&&o<45?a=[i,e+h,i+s,e+h-s*t(o-0)]:o>=45&&o<90?a=[i,e+h,i+s-h*t(o-45),e]:o>=90&&o<135?a=[i+s,e+h,i+s-h*t(o-90),e]:o>=135&&o<180?a=[i+s,e+h,i,e+s*t(o-135)]:o>=180&&o<225?a=[i+s,e,i,e+s*t(o-180)]:o>=225&&o<270?a=[i+s,e,i+h*t(o-225),e+h]:o>=270&&o<315?a=[i,e,i+h*t(o-270),e+h]:o>=315&&o<360&&(a=[i,e,i+s,e+h-s*t(o-315)])}else o.includes("top")?a=[i,e+h,i,e]:o.includes("bottom")?a=[i,e,i,e+h]:o.includes("left")?a=[i+s,e,i,e]:o.includes("right")&&(a=[i,e,i+s,e]);const l=t.createLinearGradient(...a.map((t=>t>>0)));return r.reduce(((t,i,e)=>{const s=i.split(" ");return 1===s.length?t.addColorStop(e,s[0]):2===s.length&&t.addColorStop(...s),t}),l)})(r,t,i,e,s,h)),h}play(){this.startTime||(clearInterval(this.timer),cancelAnimationFrame(this.animationId),this.startTime=Date.now(),this.prizeFlag=void 0,this.run())}stop(t){this.prizeFlag=t%this.prizes.length}run(t=0){const{currIndex:i,prizes:e,prizeFlag:s,startTime:h,_defaultConfig:n}=this;let r=Date.now()-h;if(r>=n.accelerationTime&&void 0!==s)return this.FPS=r/t,this.endTime=Date.now(),this.stopIndex=i,this.endIndex=5*e.length+s-(i>>0),cancelAnimationFrame(this.animationId),this.slowDown();this.currIndex=(i+l(r,.1,n.speed,n.accelerationTime))%e.length,this.draw(),this.animationId=window.requestAnimationFrame(this.run.bind(this,t+1))}slowDown(){const{prizes:t,prizeFlag:i,stopIndex:e,endIndex:s,_defaultConfig:h}=this;let n=Date.now()-this.endTime;if(n>h.decelerationTime)return this.startTime=0,this.endCallback?.({...t.find(((t,e)=>e===i))}),cancelAnimationFrame(this.animationId);this.currIndex=d(n,e,s,h.decelerationTime)%t.length,this.draw(),this.animationId=window.requestAnimationFrame(this.slowDown.bind(this))}walk(){clearInterval(this.timer),this.timer=window.setInterval((()=>{this.currIndex+=1,this.draw()}),1300)}getGeometricProperty([t,i,e,s]){const{cellWidth:h,cellHeight:n}=this,r=this._defaultConfig.gutter;let o=[this.prizeArea.x+(h+r)*t,this.prizeArea.y+(n+r)*i];return e&&s&&o.push(h*e+r*(e-1),n*s+r*(s-1)),o}getLength(t){return e(t,"number")?t:e(t,"string")?this.changeUnits(t,{clean:!0}):0}getWidth(t,i=1){return e(t,"number")?t*this.dpr:e(t,"string")?this.changeUnits(t,{denominator:this.cellWidth*i+this._defaultConfig.gutter*(i-1)}):0}getHeight(t,i=1){return e(t,"number")?t*this.dpr:e(t,"string")?this.changeUnits(t,{denominator:this.cellHeight*i+this._defaultConfig.gutter*(i-1)}):0}getOffsetX(t,i=1){return(this.cellWidth*i+this._defaultConfig.gutter*(i-1)-t)/2}},t.LuckyWheel=class extends i{constructor(t,i={}){super(),this.blocks=[],this.prizes=[],this.buttons=[],this.defaultConfig={},this._defaultConfig={gutter:"0px",offsetDegree:0,speed:20,accelerationTime:2500,decelerationTime:2500},this.defaultStyle={},this._defaultStyle={fontSize:"18px",fontColor:"#000",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",lineHeight:"",background:"#fff",wordWrap:!0,lengthLimit:"90%"},this.Radius=0,this.prizeRadius=0,this.prizeDeg=0,this.prizeRadian=0,this.rotateDeg=0,this.maxBtnRadius=0,this.startTime=0,this.endTime=0,this.stopDeg=0,this.endDeg=0,this.animationId=0,this.FPS=16.6,this.prizeImgs=[[]],this.btnImgs=[[]],this.box=document.querySelector(t),this.canvas=document.createElement("canvas"),this.box.appendChild(this.canvas),this.ctx=this.canvas.getContext("2d"),this.initData(i),this.initComputed(),this.initWatch();let e=[[]];this.prizes&&(e=this.prizes.map((t=>t.imgs))),this.buttons&&e.push(...this.buttons.map((t=>t.imgs))),this.init(e)}initData(t){this.$set(this,"blocks",t.blocks||[]),this.$set(this,"prizes",t.prizes||[]),this.$set(this,"buttons",t.buttons||[]),this.$set(this,"defaultConfig",t.defaultConfig||{}),this.$set(this,"defaultStyle",t.defaultStyle||{}),this.$set(this,"startCallback",t.start),this.$set(this,"endCallback",t.end)}initComputed(){this.$computed(this,"_defaultConfig",(()=>({gutter:"0px",offsetDegree:0,speed:20,accelerationTime:2500,decelerationTime:2500,...this.defaultConfig}))),this.$computed(this,"_defaultStyle",(()=>({fontSize:"18px",fontColor:"#000",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",background:"#fff",wordWrap:!0,lengthLimit:"90%",...this.defaultStyle})))}initWatch(){this.$watch("prizes",((t,i)=>{let e=[];return i?t&&t.forEach(((t,s)=>{let h=[];const n=i[s];n?t.imgs&&t.imgs.forEach(((t,i)=>{if(!n.imgs)return h[i]=t;const e=n.imgs[i];e&&this.prizeImgs[s]&&this.prizeImgs[s][i]?t.src!==e.src&&(h[i]=t):h[i]=t})):h=t.imgs||[],e[s]=h})):e=t.map((t=>t.imgs)),this.init(e)})),this.$watch("buttons",((t,i)=>{let e=[];return i?t&&t.forEach(((t,s)=>{let h=[];const n=i[s];n&&n.imgs?t.imgs&&t.imgs.forEach(((t,i)=>{if(!n.imgs)return h[i]=t;const e=n.imgs[i];e&&this.btnImgs[s]&&this.btnImgs[s][i]?t.src!==e.src&&(h[i]=t):h[i]=t})):h=t.imgs||[],e[s]=h})):e=t.map((t=>t.imgs)),this.init([...new Array(this.prizes.length).fill(void 0),...e])}))}init(t){this.setDpr(),this.setHTMLFontSize();const{box:i,canvas:s,ctx:h,dpr:n}=this;if(!i)return;s.width=s.height=i.offsetWidth*n,this.Radius=s.width/2,this.optimizeClarity(s,2*this.Radius,2*this.Radius),h.translate(this.Radius,this.Radius);const r=()=>{this.draw(),s.onclick=t=>{h.beginPath(),h.arc(0,0,this.maxBtnRadius,0,2*Math.PI,!1),h.isPointInPath(t.offsetX,t.offsetY)&&(this.startTime||this.startCallback?.(t))}};let o=0,a=0;e(t,"array")&&(this.draw(),t.forEach(((t,i)=>{if(!t)return!1;t.forEach(((t,e)=>{a++,this.loadAndCacheImg(i,e,(()=>{o++,a===o&&r.call(this)}))}))}))),a||r.call(this)}loadAndCacheImg(t,i,e){const s=t<this.prizes.length,h=s?"prizes":"buttons",n=s?"prizeImgs":"btnImgs";t=s?t:t-this.prizes.length;const r=this[h][t];if(!r||!r.imgs)return;const o=r.imgs[i];if(!o)return;let a=new Image;this[n][t]||(this[n][t]=[]),this[n][t][i]=a,a.src=o.src,a.onload=()=>e.call(this)}computedWidthAndHeight(t,i,e,s){if(!i.width&&!i.height)return[t.width,t.height];if(i.width&&!i.height){let s=this.getWidth(i.width,e);return[s,t.height*(s/t.width)]}if(!i.width&&i.height){let e=this.getHeight(i.height,s);return[t.width*(e/t.height),e]}return[this.getWidth(i.width,e),this.getHeight(i.height,s)]}draw(){const{ctx:t,dpr:i,_defaultConfig:e,_defaultStyle:r}=this;t.clearRect(-this.Radius,-this.Radius,2*this.Radius,2*this.Radius),this.prizeRadius=this.blocks.reduce(((e,s)=>(t.beginPath(),t.fillStyle=s.background,t.arc(0,0,e,0,2*Math.PI,!1),t.fill(),e-this.getLength(s.padding.split(" ")[0])*i)),this.Radius),this.prizeDeg=360/this.prizes.length,this.prizeRadian=h(this.prizeDeg);let a=h(-90+this.rotateDeg+e.offsetDegree);const l=i=>this.getOffsetX(t.measureText(i).width),d=(t,e,s)=>{const h=t.lineHeight||r.lineHeight||t.fontSize||r.fontSize;return this.getHeight(t.top,e)+(s+1)*this.getLength(h)*i};t.save(),this.prizes.forEach(((c,g)=>{let f=a+g*this.prizeRadian,u=this.prizeRadius-this.maxBtnRadius;((t,i,e,s,r,a,l)=>{i||(i=a);let d=h(90/Math.PI/e*a),c=h(90/Math.PI/i*a),g=s+d,f=r-d,u=s+c,m=r-c;t.beginPath(),t.fillStyle=l,t.moveTo(...n(g,e)),o(t,e,g,f,!0),m>u?o(t,i,u,m,!1):t.lineTo(...n((s+r)/2,a/2/Math.abs(Math.sin((s-r)/2)))),t.closePath(),t.fill()})(t,this.maxBtnRadius,this.prizeRadius,f-this.prizeRadian/2,f+this.prizeRadian/2,this.getLength(e.gutter)*i,c.background||r.background||"rgba(0, 0, 0, 0)");let m=Math.cos(f)*this.prizeRadius,p=Math.sin(f)*this.prizeRadius;t.translate(m,p),t.rotate(f+h(90)),c.imgs&&c.imgs.forEach(((i,e)=>{if(!this.prizeImgs[g])return;const s=this.prizeImgs[g][e];if(!s)return;const[h,n]=this.computedWidthAndHeight(s,i,this.prizeRadian*this.prizeRadius,u);t.drawImage(s,this.getOffsetX(h),this.getHeight(i.top,u),h,n)})),c.fonts&&c.fonts.forEach((h=>{let n=h.fontColor||r.fontColor,o=h.fontWeight||r.fontWeight,a=this.getLength(h.fontSize||r.fontSize),c=h.fontStyle||r.fontStyle;t.fillStyle=n,t.font=`${o} ${a*i}px ${c}`;let g=[],f=String(h.text);if(h.hasOwnProperty("wordWrap")?h.wordWrap:r.wordWrap){f=s(f);let n="";for(let s=0;s<f.length;s++){n+=f[s];let o=t.measureText(n).width,a=(this.prizeRadius-d(h,u,g.length))*Math.tan(this.prizeRadian/2)*2-this.getLength(e.gutter)*i;o>this.getWidth(h.lengthLimit||r.lengthLimit,a)&&(g.push(n.slice(0,-1)),n=f[s])}n&&g.push(n),g.length||g.push(f)}else g=f.split("\n");g.filter((t=>!!t)).forEach(((i,e)=>{t.fillText(i,l(i),d(h,u,e))}))})),t.rotate(h(360)-f-h(90)),t.translate(-m,-p)})),t.restore(),this.buttons.forEach(((e,s)=>{let h=this.getHeight(e.radius);this.maxBtnRadius=Math.max(this.maxBtnRadius,h),t.beginPath(),t.fillStyle=e.background||"rgba(0, 0, 0, 0)",t.arc(0,0,h,0,2*Math.PI,!1),t.fill(),e.pointer&&(t.beginPath(),t.fillStyle=e.background||"rgba(0, 0, 0, 0)",t.moveTo(-h,0),t.lineTo(h,0),t.lineTo(0,2*-h),t.closePath(),t.fill()),e.imgs&&e.imgs.forEach(((i,n)=>{if(!this.btnImgs[s])return;const r=this.btnImgs[s][n];if(!r)return;const[o,a]=this.computedWidthAndHeight(r,i,2*this.getHeight(e.radius),2*this.getHeight(e.radius));t.drawImage(r,this.getOffsetX(o),this.getHeight(i.top,h),o,a)})),e.fonts&&e.fonts.forEach((e=>{let s=e.fontColor||r.fontColor,n=e.fontWeight||r.fontWeight,o=this.getLength(e.fontSize||r.fontSize),a=e.fontStyle||r.fontStyle;t.fillStyle=s,t.font=`${n} ${o*i}px ${a}`,String(e.text).split("\n").forEach(((i,s)=>{t.fillText(i,l(i),d(e,h,s))}))}))}))}play(){this.startTime||(cancelAnimationFrame(this.animationId),this.startTime=Date.now(),this.prizeFlag=void 0,this.run())}stop(t){this.prizeFlag=Number(t)%this.prizes.length}run(t=0){const{prizeFlag:i,prizeDeg:e,rotateDeg:s,_defaultConfig:h}=this;let n=Date.now()-this.startTime;if(n>=h.accelerationTime&&void 0!==i)return this.FPS=n/t,this.endTime=Date.now(),this.stopDeg=s,this.endDeg=1800-i*e-s-h.offsetDegree,cancelAnimationFrame(this.animationId),this.slowDown();this.rotateDeg=(s+l(n,0,h.speed,h.accelerationTime))%360,this.draw(),this.animationId=window.requestAnimationFrame(this.run.bind(this,t+1))}slowDown(){const{prizes:t,prizeFlag:i,stopDeg:e,endDeg:s,_defaultConfig:h}=this;let n=Date.now()-this.endTime;if(n>=h.decelerationTime)return this.startTime=0,this.endCallback?.({...t.find(((t,e)=>e===i))}),cancelAnimationFrame(this.animationId);this.rotateDeg=d(n,e,s,h.decelerationTime)%360,this.draw(),this.animationId=window.requestAnimationFrame(this.slowDown.bind(this))}getLength(t){return e(t,"number")?t:e(t,"string")?this.changeUnits(t,{clean:!0}):0}getWidth(t,i=this.prizeRadian*this.prizeRadius){return e(t,"number")?t*this.dpr:e(t,"string")?this.changeUnits(t,{denominator:i}):0}getHeight(t,i=this.prizeRadius){return e(t,"number")?t*this.dpr:e(t,"string")?this.changeUnits(t,{denominator:i}):0}getOffsetX(t){return-t/2}},Object.defineProperty(t,"__esModule",{value:!0})}));
+!function(t,i){"object"==typeof exports&&"undefined"!=typeof module?i(exports):"function"==typeof define&&define.amd?define(["exports"],i):i((t="undefined"!=typeof globalThis?globalThis:t||self).LuckyCanvas={})}(this,(function(t){"use strict";class i{constructor(){this.htmlFontSize=16,this.dpr=1,this.subs={},this.setDpr(),this.setHTMLFontSize(),this.resetArrayPropo()}setDpr(){window.dpr=this.dpr=1.3*(window.devicePixelRatio||2)}setHTMLFontSize(){this.htmlFontSize=+getComputedStyle(document.documentElement).fontSize.slice(0,-2)}optimizeClarity(t,i,e){const{dpr:s}=this,h=t=>(t*s-t)/(t*s)*(s/2)*100;t.style.transform=`scale(${1/s}) translate(\n      ${-h(i)}%, ${-h(e)}%\n    )`}changeUnits(t,{denominator:i=1,clean:e=!1}){return Number(t.replace(/^(\-*[0-9.]*)([a-z%]*)$/,((t,s,h)=>{switch(h){case"%":s*=i/100;break;case"px":s*=1;break;case"rem":s*=this.htmlFontSize;break;default:s*=1}return e||"%"===h?s:s*this.dpr})))}draw(){}observer(t){t&&"object"==typeof t&&Object.keys(t).forEach((i=>{this.defineReactive(t,i,t[i])}))}defineReactive(t,i,e){this.observer(e),Object.defineProperty(t,i,{get:()=>e,set:t=>{let s=e;t!==e&&(e=t,this.observer(e),this.subs[i]&&this.subs[i].call(this,e,s),this.draw())}})}$set(t,i,e){t&&"object"==typeof t&&this.defineReactive(t,i,e)}$computed(t,i,e){Object.defineProperty(t,i,{get:()=>e.call(this)})}$watch(t,i){this.subs[t]=i}resetArrayPropo(){const t=this,i=Array.prototype,e=Object.create(i);["push","pop","shift","unshift","sort","splice","reverse"].forEach((s=>{e[s]=function(){t.draw(),i[s].call(this,...arguments)}}))}}const e=(t,...i)=>i.some((i=>Object.prototype.toString.call(t).slice(8,-1).toLowerCase()===i)),s=t=>[].filter.call(t,(t=>"\n"!==t)).join(""),h=t=>Math.PI/180*t,n=(t,i)=>[+(Math.cos(t)*i).toFixed(8),+(Math.sin(t)*i).toFixed(8)],r=(t,i)=>{let e=-t/i;return[e,-e*t+i]},o=(t,i,e,s,a=!0)=>{if(Math.abs(s-e).toFixed(8)>=h(180).toFixed(8)){let h=(s+e)/2;return a?(o(t,i,e,h,a),o(t,i,h,s,a)):(o(t,i,h,s,a),o(t,i,e,h,a)),!1}a||([e,s]=[s,e]);const[l,d]=n(e,i),[c,g]=n(s,i),[f,u]=r(l,d),[m,p]=r(c,g);let b=(p-u)/(f-m),w=(m*u-f*p)/(m-f);isNaN(b)&&(Math.abs(l)===+i.toFixed(8)&&(b=l),Math.abs(c)===+i.toFixed(8)&&(b=c)),f===1/0||f===-1/0?w=m*b+p:m!==1/0&&m!==-1/0||(w=f*b+u),t.lineTo(l,d),t.arcTo(b,w,c,g,i)},a=(t,i,e,s,h,n,r)=>{let o=Math.min(s,h);n>o/2&&(n=o/2),t.beginPath(),t.fillStyle=r,t.moveTo(i+n,e),t.lineTo(i+n,e),t.lineTo(i+s-n,e),t.arcTo(i+s,e,i+s,e+n,n),t.lineTo(i+s,e+h-n),t.arcTo(i+s,e+h,i+s-n,e+h,n),t.lineTo(i+n,e+h),t.arcTo(i,e+h,i,e+h-n,n),t.lineTo(i,e+n),t.arcTo(i,e,i+n,e,n),t.closePath(),t.fill()},l=function(t,i,e,s){return t>=s&&(t=s),e*(t/=s)*t+i},d=function(t,i,e,s){return t>=s&&(t=s),-e*(t/=s)*(t-2)+i};t.LuckyGrid=class extends i{constructor(t,i={}){super(),this.rows=3,this.cols=3,this.blocks=[],this.prizes=[],this.defaultConfig={},this._defaultConfig={gutter:5,speed:20,accelerationTime:2500,decelerationTime:2500},this.defaultStyle={},this._defaultStyle={borderRadius:20,fontColor:"#000",fontSize:"18px",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",lineHeight:"",background:"#fff",shadow:"",wordWrap:!0,lengthLimit:"90%"},this.activeStyle={},this._activeStyle={background:"#ffce98",shadow:"",fontStyle:"",fontWeight:"",fontSize:"",lineHeight:"",fontColor:""},this.boxWidth=0,this.boxHeight=0,this.cellWidth=0,this.cellHeight=0,this.startTime=0,this.endTime=0,this.currIndex=0,this.stopIndex=0,this.endIndex=0,this.demo=!1,this.timer=0,this.animationId=0,this.FPS=16.6,this.cells=[],this.cellImgs=[],this.box=document.querySelector(t),this.canvas=document.createElement("canvas"),this.box.appendChild(this.canvas),this.ctx=this.canvas.getContext("2d"),this.initData(i),this.initComputed(),this.initWatch();let e=[[]];this.prizes&&(e=this.prizes.map((t=>t.imgs))),this.button&&(e[this.cols*this.rows-1]=this.button.imgs),this.init(e)}initData(t){this.$set(this,"rows",Number(t.rows)||3),this.$set(this,"cols",Number(t.cols)||3),this.$set(this,"blocks",t.blocks||[]),this.$set(this,"prizes",t.prizes||[]),this.$set(this,"button",t.button),this.$set(this,"defaultConfig",t.defaultConfig||{}),this.$set(this,"defaultStyle",t.defaultStyle||{}),this.$set(this,"activeStyle",t.activeStyle||{}),this.$set(this,"startCallback",t.start),this.$set(this,"endCallback",t.end)}initComputed(){this.$computed(this,"_defaultConfig",(()=>{const t={gutter:5,speed:20,accelerationTime:2500,decelerationTime:2500,...this.defaultConfig};return t.gutter=this.getLength(t.gutter)*this.dpr,t.speed=t.speed/40,t})),this.$computed(this,"_defaultStyle",(()=>({borderRadius:20,fontColor:"#000",fontSize:"18px",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",background:"#fff",shadow:"",wordWrap:!0,lengthLimit:"90%",...this.defaultStyle}))),this.$computed(this,"_activeStyle",(()=>({background:"#ffce98",shadow:"",...this.activeStyle})))}initWatch(){this.$watch("prizes",((t,i)=>{let e=[];return i?t&&t.forEach(((t,s)=>{let h=[];const n=i[s];n?t.imgs&&t.imgs.forEach(((t,i)=>{if(!n.imgs)return h[i]=t;const e=n.imgs[i];e&&this.cellImgs[s][i]?t.src!==e.src&&(h[i]=t):h[i]=t})):h=t.imgs||[],e[s]=h})):e=t.map((t=>t.imgs)),this.init(e)})),this.$watch("button",((t,i)=>{let e=[],s=this.cols*this.rows-1;if(i&&i.imgs){if(t.imgs){const h=[];t.imgs.forEach(((t,e)=>{if(!i.imgs)return h[e]=t;const n=i.imgs[e];n&&this.cellImgs[s][e]?t.src!==n.src&&(h[e]=t):h[e]=t})),e[s]=h}}else e[s]=t.imgs;return this.init(e)}))}init(t){this.setDpr(),this.setHTMLFontSize();const{box:i,canvas:s,dpr:h}=this;if(!i)return;this.boxWidth=s.width=i.offsetWidth*h,this.boxHeight=s.height=i.offsetHeight*h,this.optimizeClarity(s,this.boxWidth,this.boxHeight);const n=()=>{this.draw(),this.demo&&this.walk(),this.button&&(s.onclick=t=>{const[i,e,s,h]=this.getGeometricProperty([this.button.x,this.button.y,this.button.col||1,this.button.row||1]);if(t.offsetX<i||t.offsetY<e||t.offsetX>i+s||t.offsetY>e+h)return!1;this.startTime||this.startCallback?.(t)})};let r=0,o=0;e(t,"array")&&(this.draw(),t.forEach(((t,i)=>{if(!t)return!1;t.forEach(((t,e)=>{o++,this.loadAndCacheImg(i,e,(()=>{r++,o===r&&n.call(this)}))}))}))),o||n.call(this)}loadAndCacheImg(t,i,e){const s=this.cells[t];if(!s||!s.imgs)return;const h=s.imgs[i];this.cellImgs[t]||(this.cellImgs[t]=[]);let n=new Image;this.cellImgs[t][i]={defaultImg:n},n.src=h.src;let r=0,o=1;if(n.onload=()=>{r++,r===o&&e.call(this)},!h.hasOwnProperty("activeSrc"))return;o++;let a=new Image;this.cellImgs[t][i].activeImg=a,a.src=h.activeSrc,a.onload=()=>{r++,r===o&&e.call(this)}}computedWidthAndHeight(t,i,e){if(!i.width&&!i.height)return[t.width,t.height];if(i.width&&!i.height){let s=this.getWidth(i.width,e.col);return[s,t.height*(s/t.width)]}if(!i.width&&i.height){let s=this.getHeight(i.height,e.row);return[t.width*(s/t.height),s]}return[this.getWidth(i.width,e.col),this.getHeight(i.height,e.row)]}draw(){const{ctx:t,dpr:i,_defaultConfig:h,_defaultStyle:n,_activeStyle:r}=this;t.clearRect(0,0,this.boxWidth,this.boxWidth),this.cells=[...this.prizes],this.button&&(this.cells[this.cols*this.rows-1]=this.button),this.cells.forEach((t=>{t.col=t.col||1,t.row=t.row||1})),this.prizeArea=this.blocks.reduce((({x:s,y:h,w:n,h:r},o)=>{const[l,d,c,g]=(t=>{let i=t.padding.replace(/px/g,"").split(" ").map((t=>~~t))||[0],s=0,h=0,n=0,r=0;switch(i.length){case 1:s=h=n=r=i[0];break;case 2:s=h=i[0],n=r=i[1];break;case 3:s=i[0],n=r=i[1],h=i[2];break;default:s=i[0],h=i[1],n=i[2],r=i[3]}const o={paddingTop:s,paddingBottom:h,paddingLeft:n,paddingRight:r};for(let i in o)o[i]=t.hasOwnProperty(i)&&e(t[i],"string","number")?~~String(t[i]).replace(/px/g,""):o[i];return[s,h,n,r]})(o).map((t=>t*i)),f=o.borderRadius?this.getLength(o.borderRadius)*i:0;return a(t,s,h,n,r,f,this.handleBackground(s,h,n,r,o.background)),{x:s+c,y:h+l,w:n-c-g,h:r-l-d}}),{x:0,y:0,w:this.boxWidth,h:this.boxHeight}),this.cellWidth=(this.prizeArea.w-h.gutter*(this.cols-1))/this.cols,this.cellHeight=(this.prizeArea.h-h.gutter*(this.rows-1))/this.rows,this.cells.forEach(((e,h)=>{let[o,l,d,c]=this.getGeometricProperty([e.x,e.y,e.col,e.row]);const g=h===this.currIndex%this.prizes.length>>0,f=(g?r.shadow:e.shadow||n.shadow).replace(/px/g,"").split(",")[0].split(" ").map(((t,e)=>e<3?Number(t)*i:t));4===f.length&&(t.shadowColor=f[3],t.shadowOffsetX=f[0],t.shadowOffsetY=f[1],t.shadowBlur=f[2],f[0]>0?d-=f[0]:(d+=f[0],o-=f[0]),f[1]>0?c-=f[1]:(c+=f[1],l-=f[1])),a(t,o,l,d,c,this.getLength(e.borderRadius?e.borderRadius:n.borderRadius)*i,this.handleBackground(o,l,d,c,e.background,g)),t.shadowColor="rgba(255, 255, 255, 0)",t.shadowOffsetX=0,t.shadowOffsetY=0,t.shadowBlur=0,e.imgs&&e.imgs.forEach(((i,s)=>{if(!this.cellImgs[h])return!1;const n=this.cellImgs[h][s];if(!n)return!1;const r=g&&n.activeImg||n.defaultImg,[a,d]=this.computedWidthAndHeight(r,i,e);t.drawImage(r,o+this.getOffsetX(a,e.col),l+this.getHeight(i.top,e.row),a,d)})),e.fonts&&e.fonts.forEach((h=>{let a=g&&r.fontStyle?r.fontStyle:h.fontStyle||n.fontStyle,d=g&&r.fontWeight?r.fontWeight:h.fontWeight||n.fontWeight,c=g&&r.fontSize?this.getLength(r.fontSize):this.getLength(h.fontSize||n.fontSize);const f=g&&r.lineHeight?r.lineHeight:h.lineHeight||n.lineHeight||h.fontSize||n.fontSize;t.font=`${d} ${c*i}px ${a}`,t.fillStyle=g&&r.fontColor?r.fontColor:h.fontColor||n.fontColor;let u=[],m=String(h.text);if(h.hasOwnProperty("wordWrap")?h.wordWrap:n.wordWrap){m=s(m);let i="";for(let s=0;s<m.length;s++){i+=m[s],t.measureText(i).width>this.getWidth(h.lengthLimit||n.lengthLimit,e.col)&&(u.push(i.slice(0,-1)),i=m[s])}i&&u.push(i),u.length||u.push(m)}else u=m.split("\n");u.forEach(((s,n)=>{t.fillText(s,o+this.getOffsetX(t.measureText(s).width,e.col),l+this.getHeight(h.top,e.row)+(n+1)*this.getLength(f)*i)}))}))}))}handleBackground(t,i,e,s,h,n=!1){const{ctx:r,_defaultStyle:o,_activeStyle:a}=this;return(h=n?a.background:h||o.background).includes("linear-gradient")&&(h=((t,i,e,s,h,n)=>{const r=/linear-gradient\((.+)\)/.exec(n)[1].split(",").map((t=>t.trim()));let o=r.shift(),a=[0,0,0,0];if(o.includes("deg")){o=o.slice(0,-3)%360;const t=t=>Math.tan(t/180*Math.PI);o>=0&&o<45?a=[i,e+h,i+s,e+h-s*t(o-0)]:o>=45&&o<90?a=[i,e+h,i+s-h*t(o-45),e]:o>=90&&o<135?a=[i+s,e+h,i+s-h*t(o-90),e]:o>=135&&o<180?a=[i+s,e+h,i,e+s*t(o-135)]:o>=180&&o<225?a=[i+s,e,i,e+s*t(o-180)]:o>=225&&o<270?a=[i+s,e,i+h*t(o-225),e+h]:o>=270&&o<315?a=[i,e,i+h*t(o-270),e+h]:o>=315&&o<360&&(a=[i,e,i+s,e+h-s*t(o-315)])}else o.includes("top")?a=[i,e+h,i,e]:o.includes("bottom")?a=[i,e,i,e+h]:o.includes("left")?a=[i+s,e,i,e]:o.includes("right")&&(a=[i,e,i+s,e]);const l=t.createLinearGradient(...a.map((t=>t>>0)));return r.reduce(((t,i,e)=>{const s=i.split(" ");return 1===s.length?t.addColorStop(e,s[0]):2===s.length&&t.addColorStop(...s),t}),l)})(r,t,i,e,s,h)),h}play(){this.startTime||(clearInterval(this.timer),cancelAnimationFrame(this.animationId),this.startTime=Date.now(),this.prizeFlag=void 0,this.run())}stop(t){this.prizeFlag=t%this.prizes.length}run(t=0){const{currIndex:i,prizes:e,prizeFlag:s,startTime:h,_defaultConfig:n}=this;let r=Date.now()-h;if(r>=n.accelerationTime&&void 0!==s){this.FPS=r/t,this.endTime=Date.now(),this.stopIndex=i;let h=0;for(;++h;){const t=e.length*h+s-(i>>0);if(d(this.FPS,this.stopIndex,t,n.decelerationTime)-this.stopIndex>n.speed){this.endIndex=t;break}}return cancelAnimationFrame(this.animationId),this.slowDown()}this.currIndex=(i+l(r,.1,n.speed,n.accelerationTime))%e.length,this.draw(),this.animationId=window.requestAnimationFrame(this.run.bind(this,t+1))}slowDown(){const{prizes:t,prizeFlag:i,stopIndex:e,endIndex:s,_defaultConfig:h}=this;let n=Date.now()-this.endTime;if(n>h.decelerationTime)return this.startTime=0,this.endCallback?.({...t.find(((t,e)=>e===i))}),cancelAnimationFrame(this.animationId);this.currIndex=d(n,e,s,h.decelerationTime)%t.length,this.draw(),this.animationId=window.requestAnimationFrame(this.slowDown.bind(this))}walk(){clearInterval(this.timer),this.timer=window.setInterval((()=>{this.currIndex+=1,this.draw()}),1300)}getGeometricProperty([t,i,e,s]){const{cellWidth:h,cellHeight:n}=this,r=this._defaultConfig.gutter;let o=[this.prizeArea.x+(h+r)*t,this.prizeArea.y+(n+r)*i];return e&&s&&o.push(h*e+r*(e-1),n*s+r*(s-1)),o}getLength(t){return e(t,"number")?t:e(t,"string")?this.changeUnits(t,{clean:!0}):0}getWidth(t,i=1){return e(t,"number")?t*this.dpr:e(t,"string")?this.changeUnits(t,{denominator:this.cellWidth*i+this._defaultConfig.gutter*(i-1)}):0}getHeight(t,i=1){return e(t,"number")?t*this.dpr:e(t,"string")?this.changeUnits(t,{denominator:this.cellHeight*i+this._defaultConfig.gutter*(i-1)}):0}getOffsetX(t,i=1){return(this.cellWidth*i+this._defaultConfig.gutter*(i-1)-t)/2}},t.LuckyWheel=class extends i{constructor(t,i={}){super(),this.blocks=[],this.prizes=[],this.buttons=[],this.defaultConfig={},this._defaultConfig={gutter:"0px",offsetDegree:0,speed:20,accelerationTime:2500,decelerationTime:2500},this.defaultStyle={},this._defaultStyle={fontSize:"18px",fontColor:"#000",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",lineHeight:"",background:"#fff",wordWrap:!0,lengthLimit:"90%"},this.Radius=0,this.prizeRadius=0,this.prizeDeg=0,this.prizeRadian=0,this.rotateDeg=0,this.maxBtnRadius=0,this.startTime=0,this.endTime=0,this.stopDeg=0,this.endDeg=0,this.animationId=0,this.FPS=16.6,this.prizeImgs=[[]],this.btnImgs=[[]],this.box=document.querySelector(t),this.canvas=document.createElement("canvas"),this.box.appendChild(this.canvas),this.ctx=this.canvas.getContext("2d"),this.initData(i),this.initComputed(),this.initWatch();let e=[[]];this.prizes&&(e=this.prizes.map((t=>t.imgs))),this.buttons&&e.push(...this.buttons.map((t=>t.imgs))),this.init(e)}initData(t){this.$set(this,"blocks",t.blocks||[]),this.$set(this,"prizes",t.prizes||[]),this.$set(this,"buttons",t.buttons||[]),this.$set(this,"defaultConfig",t.defaultConfig||{}),this.$set(this,"defaultStyle",t.defaultStyle||{}),this.$set(this,"startCallback",t.start),this.$set(this,"endCallback",t.end)}initComputed(){this.$computed(this,"_defaultConfig",(()=>({gutter:"0px",offsetDegree:0,speed:20,accelerationTime:2500,decelerationTime:2500,...this.defaultConfig}))),this.$computed(this,"_defaultStyle",(()=>({fontSize:"18px",fontColor:"#000",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",background:"#fff",wordWrap:!0,lengthLimit:"90%",...this.defaultStyle})))}initWatch(){this.$watch("prizes",((t,i)=>{let e=[];return i?t&&t.forEach(((t,s)=>{let h=[];const n=i[s];n?t.imgs&&t.imgs.forEach(((t,i)=>{if(!n.imgs)return h[i]=t;const e=n.imgs[i];e&&this.prizeImgs[s]&&this.prizeImgs[s][i]?t.src!==e.src&&(h[i]=t):h[i]=t})):h=t.imgs||[],e[s]=h})):e=t.map((t=>t.imgs)),this.init(e)})),this.$watch("buttons",((t,i)=>{let e=[];return i?t&&t.forEach(((t,s)=>{let h=[];const n=i[s];n&&n.imgs?t.imgs&&t.imgs.forEach(((t,i)=>{if(!n.imgs)return h[i]=t;const e=n.imgs[i];e&&this.btnImgs[s]&&this.btnImgs[s][i]?t.src!==e.src&&(h[i]=t):h[i]=t})):h=t.imgs||[],e[s]=h})):e=t.map((t=>t.imgs)),this.init([...new Array(this.prizes.length).fill(void 0),...e])}))}init(t){this.setDpr(),this.setHTMLFontSize();const{box:i,canvas:s,ctx:h,dpr:n}=this;if(!i)return;s.width=s.height=i.offsetWidth*n,this.Radius=s.width/2,this.optimizeClarity(s,2*this.Radius,2*this.Radius),h.translate(this.Radius,this.Radius);const r=()=>{this.draw(),s.onclick=t=>{h.beginPath(),h.arc(0,0,this.maxBtnRadius,0,2*Math.PI,!1),h.isPointInPath(t.offsetX,t.offsetY)&&(this.startTime||this.startCallback?.(t))}};let o=0,a=0;e(t,"array")&&(this.draw(),t.forEach(((t,i)=>{if(!t)return!1;t.forEach(((t,e)=>{a++,this.loadAndCacheImg(i,e,(()=>{o++,a===o&&r.call(this)}))}))}))),a||r.call(this)}loadAndCacheImg(t,i,e){const s=t<this.prizes.length,h=s?"prizes":"buttons",n=s?"prizeImgs":"btnImgs";t=s?t:t-this.prizes.length;const r=this[h][t];if(!r||!r.imgs)return;const o=r.imgs[i];if(!o)return;let a=new Image;this[n][t]||(this[n][t]=[]),this[n][t][i]=a,a.src=o.src,a.onload=()=>e.call(this)}computedWidthAndHeight(t,i,e,s){if(!i.width&&!i.height)return[t.width,t.height];if(i.width&&!i.height){let s=this.getWidth(i.width,e);return[s,t.height*(s/t.width)]}if(!i.width&&i.height){let e=this.getHeight(i.height,s);return[t.width*(e/t.height),e]}return[this.getWidth(i.width,e),this.getHeight(i.height,s)]}draw(){const{ctx:t,dpr:i,_defaultConfig:e,_defaultStyle:r}=this;t.clearRect(-this.Radius,-this.Radius,2*this.Radius,2*this.Radius),this.prizeRadius=this.blocks.reduce(((e,s)=>(t.beginPath(),t.fillStyle=s.background,t.arc(0,0,e,0,2*Math.PI,!1),t.fill(),e-this.getLength(s.padding.split(" ")[0])*i)),this.Radius),this.prizeDeg=360/this.prizes.length,this.prizeRadian=h(this.prizeDeg);let a=h(-90+this.rotateDeg+e.offsetDegree);const l=i=>this.getOffsetX(t.measureText(i).width),d=(t,e,s)=>{const h=t.lineHeight||r.lineHeight||t.fontSize||r.fontSize;return this.getHeight(t.top,e)+(s+1)*this.getLength(h)*i};t.save(),this.prizes.forEach(((c,g)=>{let f=a+g*this.prizeRadian,u=this.prizeRadius-this.maxBtnRadius;((t,i,e,s,r,a,l)=>{i||(i=a);let d=h(90/Math.PI/e*a),c=h(90/Math.PI/i*a),g=s+d,f=r-d,u=s+c,m=r-c;t.beginPath(),t.fillStyle=l,t.moveTo(...n(g,e)),o(t,e,g,f,!0),m>u?o(t,i,u,m,!1):t.lineTo(...n((s+r)/2,a/2/Math.abs(Math.sin((s-r)/2)))),t.closePath(),t.fill()})(t,this.maxBtnRadius,this.prizeRadius,f-this.prizeRadian/2,f+this.prizeRadian/2,this.getLength(e.gutter)*i,c.background||r.background||"rgba(0, 0, 0, 0)");let m=Math.cos(f)*this.prizeRadius,p=Math.sin(f)*this.prizeRadius;t.translate(m,p),t.rotate(f+h(90)),c.imgs&&c.imgs.forEach(((i,e)=>{if(!this.prizeImgs[g])return;const s=this.prizeImgs[g][e];if(!s)return;const[h,n]=this.computedWidthAndHeight(s,i,this.prizeRadian*this.prizeRadius,u);t.drawImage(s,this.getOffsetX(h),this.getHeight(i.top,u),h,n)})),c.fonts&&c.fonts.forEach((h=>{let n=h.fontColor||r.fontColor,o=h.fontWeight||r.fontWeight,a=this.getLength(h.fontSize||r.fontSize),c=h.fontStyle||r.fontStyle;t.fillStyle=n,t.font=`${o} ${a*i}px ${c}`;let g=[],f=String(h.text);if(h.hasOwnProperty("wordWrap")?h.wordWrap:r.wordWrap){f=s(f);let n="";for(let s=0;s<f.length;s++){n+=f[s];let o=t.measureText(n).width,a=(this.prizeRadius-d(h,u,g.length))*Math.tan(this.prizeRadian/2)*2-this.getLength(e.gutter)*i;o>this.getWidth(h.lengthLimit||r.lengthLimit,a)&&(g.push(n.slice(0,-1)),n=f[s])}n&&g.push(n),g.length||g.push(f)}else g=f.split("\n");g.filter((t=>!!t)).forEach(((i,e)=>{t.fillText(i,l(i),d(h,u,e))}))})),t.rotate(h(360)-f-h(90)),t.translate(-m,-p)})),t.restore(),this.buttons.forEach(((e,s)=>{let h=this.getHeight(e.radius);this.maxBtnRadius=Math.max(this.maxBtnRadius,h),t.beginPath(),t.fillStyle=e.background||"rgba(0, 0, 0, 0)",t.arc(0,0,h,0,2*Math.PI,!1),t.fill(),e.pointer&&(t.beginPath(),t.fillStyle=e.background||"rgba(0, 0, 0, 0)",t.moveTo(-h,0),t.lineTo(h,0),t.lineTo(0,2*-h),t.closePath(),t.fill()),e.imgs&&e.imgs.forEach(((i,n)=>{if(!this.btnImgs[s])return;const r=this.btnImgs[s][n];if(!r)return;const[o,a]=this.computedWidthAndHeight(r,i,2*this.getHeight(e.radius),2*this.getHeight(e.radius));t.drawImage(r,this.getOffsetX(o),this.getHeight(i.top,h),o,a)})),e.fonts&&e.fonts.forEach((e=>{let s=e.fontColor||r.fontColor,n=e.fontWeight||r.fontWeight,o=this.getLength(e.fontSize||r.fontSize),a=e.fontStyle||r.fontStyle;t.fillStyle=s,t.font=`${n} ${o*i}px ${a}`,String(e.text).split("\n").forEach(((i,s)=>{t.fillText(i,l(i),d(e,h,s))}))}))}))}play(){this.startTime||(cancelAnimationFrame(this.animationId),this.startTime=Date.now(),this.prizeFlag=void 0,this.run())}stop(t){this.prizeFlag=Number(t)%this.prizes.length}run(t=0){const{prizeFlag:i,prizeDeg:e,rotateDeg:s,_defaultConfig:h}=this;let n=Date.now()-this.startTime;if(n>=h.accelerationTime&&void 0!==i){this.FPS=n/t,this.endTime=Date.now(),this.stopDeg=s;let r=0;for(;++r;){const t=360*r-i*e-s-h.offsetDegree;if(d(this.FPS,this.stopDeg,t,h.decelerationTime)-this.stopDeg>h.speed){this.endDeg=t;break}}return cancelAnimationFrame(this.animationId),this.slowDown()}this.rotateDeg=(s+l(n,0,h.speed,h.accelerationTime))%360,this.draw(),this.animationId=window.requestAnimationFrame(this.run.bind(this,t+1))}slowDown(){const{prizes:t,prizeFlag:i,stopDeg:e,endDeg:s,_defaultConfig:h}=this;let n=Date.now()-this.endTime;if(n>=h.decelerationTime)return this.startTime=0,this.endCallback?.({...t.find(((t,e)=>e===i))}),cancelAnimationFrame(this.animationId);this.rotateDeg=d(n,e,s,h.decelerationTime)%360,this.draw(),this.animationId=window.requestAnimationFrame(this.slowDown.bind(this))}getLength(t){return e(t,"number")?t:e(t,"string")?this.changeUnits(t,{clean:!0}):0}getWidth(t,i=this.prizeRadian*this.prizeRadius){return e(t,"number")?t*this.dpr:e(t,"string")?this.changeUnits(t,{denominator:i}):0}getHeight(t,i=this.prizeRadius){return e(t,"number")?t*this.dpr:e(t,"string")?this.changeUnits(t,{denominator:i}):0}getOffsetX(t){return-t/2}},Object.defineProperty(t,"__esModule",{value:!0})}));

package.json

 {
   "name": "lucky-canvas",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "一个基于原生 js 的（大转盘抽奖 / 九宫格抽奖）插件",
@@ -5,0 +5,0 @@ "main": "index.js",

umd.min.js

@@ -1,1 +0,1 @@
-!function(t,i){"object"==typeof exports&&"undefined"!=typeof module?i(exports):"function"==typeof define&&define.amd?define(["exports"],i):i((t="undefined"!=typeof globalThis?globalThis:t||self).LuckyCanvas={})}(this,(function(t){"use strict";class i{constructor(){this.htmlFontSize=16,this.dpr=1,this.subs={},this.setDpr(),this.setHTMLFontSize(),this.resetArrayPropo()}setDpr(){window.dpr=this.dpr=1.3*(window.devicePixelRatio||2)}setHTMLFontSize(){this.htmlFontSize=+getComputedStyle(document.documentElement).fontSize.slice(0,-2)}optimizeClarity(t,i,e){const{dpr:s}=this,h=t=>(t*s-t)/(t*s)*(s/2)*100;t.style.transform=`scale(${1/s}) translate(\n      ${-h(i)}%, ${-h(e)}%\n    )`}changeUnits(t,{denominator:i=1,clean:e=!1}){return Number(t.replace(/^(\-*[0-9.]*)([a-z%]*)$/,((t,s,h)=>{switch(h){case"%":s*=i/100;break;case"px":s*=1;break;case"rem":s*=this.htmlFontSize;break;default:s*=1}return e||"%"===h?s:s*this.dpr})))}draw(){}observer(t){t&&"object"==typeof t&&Object.keys(t).forEach((i=>{this.defineReactive(t,i,t[i])}))}defineReactive(t,i,e){this.observer(e),Object.defineProperty(t,i,{get:()=>e,set:t=>{let s=e;t!==e&&(e=t,this.observer(e),this.subs[i]&&this.subs[i].call(this,e,s),this.draw())}})}$set(t,i,e){t&&"object"==typeof t&&this.defineReactive(t,i,e)}$computed(t,i,e){Object.defineProperty(t,i,{get:()=>e.call(this)})}$watch(t,i){this.subs[t]=i}resetArrayPropo(){const t=this,i=Array.prototype,e=Object.create(i);["push","pop","shift","unshift","sort","splice","reverse"].forEach((s=>{e[s]=function(){t.draw(),i[s].call(this,...arguments)}}))}}const e=(t,...i)=>i.some((i=>Object.prototype.toString.call(t).slice(8,-1).toLowerCase()===i)),s=t=>[].filter.call(t,(t=>"\n"!==t)).join(""),h=t=>Math.PI/180*t,n=(t,i)=>[+(Math.cos(t)*i).toFixed(8),+(Math.sin(t)*i).toFixed(8)],r=(t,i)=>{let e=-t/i;return[e,-e*t+i]},o=(t,i,e,s,a=!0)=>{if(Math.abs(s-e).toFixed(8)>=h(180).toFixed(8)){let h=(s+e)/2;return a?(o(t,i,e,h,a),o(t,i,h,s,a)):(o(t,i,h,s,a),o(t,i,e,h,a)),!1}a||([e,s]=[s,e]);const[l,d]=n(e,i),[c,g]=n(s,i),[f,u]=r(l,d),[m,p]=r(c,g);let w=(p-u)/(f-m),b=(m*u-f*p)/(m-f);isNaN(w)&&(Math.abs(l)===+i.toFixed(8)&&(w=l),Math.abs(c)===+i.toFixed(8)&&(w=c)),f===1/0||f===-1/0?b=m*w+p:m!==1/0&&m!==-1/0||(b=f*w+u),t.lineTo(l,d),t.arcTo(w,b,c,g,i)},a=(t,i,e,s,h,n,r)=>{let o=Math.min(s,h);n>o/2&&(n=o/2),t.beginPath(),t.fillStyle=r,t.moveTo(i+n,e),t.lineTo(i+n,e),t.lineTo(i+s-n,e),t.arcTo(i+s,e,i+s,e+n,n),t.lineTo(i+s,e+h-n),t.arcTo(i+s,e+h,i+s-n,e+h,n),t.lineTo(i+n,e+h),t.arcTo(i,e+h,i,e+h-n,n),t.lineTo(i,e+n),t.arcTo(i,e,i+n,e,n),t.closePath(),t.fill()},l=function(t,i,e,s){return t>=s&&(t=s),e*(t/=s)*t+i},d=function(t,i,e,s){return t>=s&&(t=s),-e*(t/=s)*(t-2)+i};t.LuckyGrid=class extends i{constructor(t,i={}){super(),this.rows=3,this.cols=3,this.blocks=[],this.prizes=[],this.defaultConfig={},this._defaultConfig={gutter:5,speed:20,accelerationTime:2500,decelerationTime:2500},this.defaultStyle={},this._defaultStyle={borderRadius:20,fontColor:"#000",fontSize:"18px",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",lineHeight:"",background:"#fff",shadow:"",wordWrap:!0,lengthLimit:"90%"},this.activeStyle={},this._activeStyle={background:"#ffce98",shadow:"",fontStyle:"",fontWeight:"",fontSize:"",lineHeight:"",fontColor:""},this.boxWidth=0,this.boxHeight=0,this.cellWidth=0,this.cellHeight=0,this.startTime=0,this.endTime=0,this.currIndex=0,this.stopIndex=0,this.endIndex=0,this.demo=!1,this.timer=0,this.animationId=0,this.FPS=16.6,this.cells=[],this.cellImgs=[],this.box=document.querySelector(t),this.canvas=document.createElement("canvas"),this.box.appendChild(this.canvas),this.ctx=this.canvas.getContext("2d"),this.initData(i),this.initComputed(),this.initWatch();let e=[[]];this.prizes&&(e=this.prizes.map((t=>t.imgs))),this.button&&(e[this.cols*this.rows-1]=this.button.imgs),this.init(e)}initData(t){this.$set(this,"rows",Number(t.rows)||3),this.$set(this,"cols",Number(t.cols)||3),this.$set(this,"blocks",t.blocks||[]),this.$set(this,"prizes",t.prizes||[]),this.$set(this,"button",t.button),this.$set(this,"defaultConfig",t.defaultConfig||{}),this.$set(this,"defaultStyle",t.defaultStyle||{}),this.$set(this,"activeStyle",t.activeStyle||{}),this.$set(this,"startCallback",t.start),this.$set(this,"endCallback",t.end)}initComputed(){this.$computed(this,"_defaultConfig",(()=>{const t={gutter:5,speed:20,accelerationTime:2500,decelerationTime:2500,...this.defaultConfig};return t.gutter=this.getLength(t.gutter)*this.dpr,t.speed=t.speed/40,t})),this.$computed(this,"_defaultStyle",(()=>({borderRadius:20,fontColor:"#000",fontSize:"18px",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",background:"#fff",shadow:"",wordWrap:!0,lengthLimit:"90%",...this.defaultStyle}))),this.$computed(this,"_activeStyle",(()=>({background:"#ffce98",shadow:"",...this.activeStyle})))}initWatch(){this.$watch("prizes",((t,i)=>{let e=[];return i?t&&t.forEach(((t,s)=>{let h=[];const n=i[s];n?t.imgs&&t.imgs.forEach(((t,i)=>{if(!n.imgs)return h[i]=t;const e=n.imgs[i];e&&this.cellImgs[s][i]?t.src!==e.src&&(h[i]=t):h[i]=t})):h=t.imgs||[],e[s]=h})):e=t.map((t=>t.imgs)),this.init(e)})),this.$watch("button",((t,i)=>{let e=[],s=this.cols*this.rows-1;if(i&&i.imgs){if(t.imgs){const h=[];t.imgs.forEach(((t,e)=>{if(!i.imgs)return h[e]=t;const n=i.imgs[e];n&&this.cellImgs[s][e]?t.src!==n.src&&(h[e]=t):h[e]=t})),e[s]=h}}else e[s]=t.imgs;return this.init(e)}))}init(t){this.setDpr(),this.setHTMLFontSize();const{box:i,canvas:s,dpr:h}=this;if(!i)return;this.boxWidth=s.width=i.offsetWidth*h,this.boxHeight=s.height=i.offsetHeight*h,this.optimizeClarity(s,this.boxWidth,this.boxHeight);const n=()=>{this.draw(),this.demo&&this.walk(),this.button&&(s.onclick=t=>{const[i,e,s,h]=this.getGeometricProperty([this.button.x,this.button.y,this.button.col||1,this.button.row||1]);if(t.offsetX<i||t.offsetY<e||t.offsetX>i+s||t.offsetY>e+h)return!1;this.startTime||this.startCallback?.(t)})};let r=0,o=0;e(t,"array")&&(this.draw(),t.forEach(((t,i)=>{if(!t)return!1;t.forEach(((t,e)=>{o++,this.loadAndCacheImg(i,e,(()=>{r++,o===r&&n.call(this)}))}))}))),o||n.call(this)}loadAndCacheImg(t,i,e){const s=this.cells[t];if(!s||!s.imgs)return;const h=s.imgs[i];this.cellImgs[t]||(this.cellImgs[t]=[]);let n=new Image;this.cellImgs[t][i]={defaultImg:n},n.src=h.src;let r=0,o=1;if(n.onload=()=>{r++,r===o&&e.call(this)},!h.hasOwnProperty("activeSrc"))return;o++;let a=new Image;this.cellImgs[t][i].activeImg=a,a.src=h.activeSrc,a.onload=()=>{r++,r===o&&e.call(this)}}computedWidthAndHeight(t,i,e){if(!i.width&&!i.height)return[t.width,t.height];if(i.width&&!i.height){let s=this.getWidth(i.width,e.col);return[s,t.height*(s/t.width)]}if(!i.width&&i.height){let s=this.getHeight(i.height,e.row);return[t.width*(s/t.height),s]}return[this.getWidth(i.width,e.col),this.getHeight(i.height,e.row)]}draw(){const{ctx:t,dpr:i,_defaultConfig:h,_defaultStyle:n,_activeStyle:r}=this;t.clearRect(0,0,this.boxWidth,this.boxWidth),this.cells=[...this.prizes],this.button&&(this.cells[this.cols*this.rows-1]=this.button),this.cells.forEach((t=>{t.col=t.col||1,t.row=t.row||1})),this.prizeArea=this.blocks.reduce((({x:s,y:h,w:n,h:r},o)=>{const[l,d,c,g]=(t=>{let i=t.padding.replace(/px/g,"").split(" ").map((t=>~~t))||[0],s=0,h=0,n=0,r=0;switch(i.length){case 1:s=h=n=r=i[0];break;case 2:s=h=i[0],n=r=i[1];break;case 3:s=i[0],n=r=i[1],h=i[2];break;default:s=i[0],h=i[1],n=i[2],r=i[3]}const o={paddingTop:s,paddingBottom:h,paddingLeft:n,paddingRight:r};for(let i in o)o[i]=t.hasOwnProperty(i)&&e(t[i],"string","number")?~~String(t[i]).replace(/px/g,""):o[i];return[s,h,n,r]})(o).map((t=>t*i)),f=o.borderRadius?this.getLength(o.borderRadius)*i:0;return a(t,s,h,n,r,f,this.handleBackground(s,h,n,r,o.background)),{x:s+c,y:h+l,w:n-c-g,h:r-l-d}}),{x:0,y:0,w:this.boxWidth,h:this.boxHeight}),this.cellWidth=(this.prizeArea.w-h.gutter*(this.cols-1))/this.cols,this.cellHeight=(this.prizeArea.h-h.gutter*(this.rows-1))/this.rows,this.cells.forEach(((e,h)=>{let[o,l,d,c]=this.getGeometricProperty([e.x,e.y,e.col,e.row]);const g=h===this.currIndex%this.prizes.length>>0,f=(g?r.shadow:e.shadow||n.shadow).replace(/px/g,"").split(",")[0].split(" ").map(((t,e)=>e<3?Number(t)*i:t));4===f.length&&(t.shadowColor=f[3],t.shadowOffsetX=f[0],t.shadowOffsetY=f[1],t.shadowBlur=f[2],f[0]>0?d-=f[0]:(d+=f[0],o-=f[0]),f[1]>0?c-=f[1]:(c+=f[1],l-=f[1])),a(t,o,l,d,c,this.getLength(e.borderRadius?e.borderRadius:n.borderRadius)*i,this.handleBackground(o,l,d,c,e.background,g)),t.shadowColor="rgba(255, 255, 255, 0)",t.shadowOffsetX=0,t.shadowOffsetY=0,t.shadowBlur=0,e.imgs&&e.imgs.forEach(((i,s)=>{if(!this.cellImgs[h])return!1;const n=this.cellImgs[h][s];if(!n)return!1;const r=g&&n.activeImg||n.defaultImg,[a,d]=this.computedWidthAndHeight(r,i,e);t.drawImage(r,o+this.getOffsetX(a,e.col),l+this.getHeight(i.top,e.row),a,d)})),e.fonts&&e.fonts.forEach((h=>{let a=g&&r.fontStyle?r.fontStyle:h.fontStyle||n.fontStyle,d=g&&r.fontWeight?r.fontWeight:h.fontWeight||n.fontWeight,c=g&&r.fontSize?this.getLength(r.fontSize):this.getLength(h.fontSize||n.fontSize);const f=g&&r.lineHeight?r.lineHeight:h.lineHeight||n.lineHeight||h.fontSize||n.fontSize;t.font=`${d} ${c*i}px ${a}`,t.fillStyle=g&&r.fontColor?r.fontColor:h.fontColor||n.fontColor;let u=[],m=String(h.text);if(h.hasOwnProperty("wordWrap")?h.wordWrap:n.wordWrap){m=s(m);let i="";for(let s=0;s<m.length;s++){i+=m[s],t.measureText(i).width>this.getWidth(h.lengthLimit||n.lengthLimit,e.col)&&(u.push(i.slice(0,-1)),i=m[s])}i&&u.push(i),u.length||u.push(m)}else u=m.split("\n");u.forEach(((s,n)=>{t.fillText(s,o+this.getOffsetX(t.measureText(s).width,e.col),l+this.getHeight(h.top,e.row)+(n+1)*this.getLength(f)*i)}))}))}))}handleBackground(t,i,e,s,h,n=!1){const{ctx:r,_defaultStyle:o,_activeStyle:a}=this;return(h=n?a.background:h||o.background).includes("linear-gradient")&&(h=((t,i,e,s,h,n)=>{const r=/linear-gradient\((.+)\)/.exec(n)[1].split(",").map((t=>t.trim()));let o=r.shift(),a=[0,0,0,0];if(o.includes("deg")){o=o.slice(0,-3)%360;const t=t=>Math.tan(t/180*Math.PI);o>=0&&o<45?a=[i,e+h,i+s,e+h-s*t(o-0)]:o>=45&&o<90?a=[i,e+h,i+s-h*t(o-45),e]:o>=90&&o<135?a=[i+s,e+h,i+s-h*t(o-90),e]:o>=135&&o<180?a=[i+s,e+h,i,e+s*t(o-135)]:o>=180&&o<225?a=[i+s,e,i,e+s*t(o-180)]:o>=225&&o<270?a=[i+s,e,i+h*t(o-225),e+h]:o>=270&&o<315?a=[i,e,i+h*t(o-270),e+h]:o>=315&&o<360&&(a=[i,e,i+s,e+h-s*t(o-315)])}else o.includes("top")?a=[i,e+h,i,e]:o.includes("bottom")?a=[i,e,i,e+h]:o.includes("left")?a=[i+s,e,i,e]:o.includes("right")&&(a=[i,e,i+s,e]);const l=t.createLinearGradient(...a.map((t=>t>>0)));return r.reduce(((t,i,e)=>{const s=i.split(" ");return 1===s.length?t.addColorStop(e,s[0]):2===s.length&&t.addColorStop(...s),t}),l)})(r,t,i,e,s,h)),h}play(){this.startTime||(clearInterval(this.timer),cancelAnimationFrame(this.animationId),this.startTime=Date.now(),this.prizeFlag=void 0,this.run())}stop(t){this.prizeFlag=t%this.prizes.length}run(t=0){const{currIndex:i,prizes:e,prizeFlag:s,startTime:h,_defaultConfig:n}=this;let r=Date.now()-h;if(r>=n.accelerationTime&&void 0!==s)return this.FPS=r/t,this.endTime=Date.now(),this.stopIndex=i,this.endIndex=5*e.length+s-(i>>0),cancelAnimationFrame(this.animationId),this.slowDown();this.currIndex=(i+l(r,.1,n.speed,n.accelerationTime))%e.length,this.draw(),this.animationId=window.requestAnimationFrame(this.run.bind(this,t+1))}slowDown(){const{prizes:t,prizeFlag:i,stopIndex:e,endIndex:s,_defaultConfig:h}=this;let n=Date.now()-this.endTime;if(n>h.decelerationTime)return this.startTime=0,this.endCallback?.({...t.find(((t,e)=>e===i))}),cancelAnimationFrame(this.animationId);this.currIndex=d(n,e,s,h.decelerationTime)%t.length,this.draw(),this.animationId=window.requestAnimationFrame(this.slowDown.bind(this))}walk(){clearInterval(this.timer),this.timer=window.setInterval((()=>{this.currIndex+=1,this.draw()}),1300)}getGeometricProperty([t,i,e,s]){const{cellWidth:h,cellHeight:n}=this,r=this._defaultConfig.gutter;let o=[this.prizeArea.x+(h+r)*t,this.prizeArea.y+(n+r)*i];return e&&s&&o.push(h*e+r*(e-1),n*s+r*(s-1)),o}getLength(t){return e(t,"number")?t:e(t,"string")?this.changeUnits(t,{clean:!0}):0}getWidth(t,i=1){return e(t,"number")?t*this.dpr:e(t,"string")?this.changeUnits(t,{denominator:this.cellWidth*i+this._defaultConfig.gutter*(i-1)}):0}getHeight(t,i=1){return e(t,"number")?t*this.dpr:e(t,"string")?this.changeUnits(t,{denominator:this.cellHeight*i+this._defaultConfig.gutter*(i-1)}):0}getOffsetX(t,i=1){return(this.cellWidth*i+this._defaultConfig.gutter*(i-1)-t)/2}},t.LuckyWheel=class extends i{constructor(t,i={}){super(),this.blocks=[],this.prizes=[],this.buttons=[],this.defaultConfig={},this._defaultConfig={gutter:"0px",offsetDegree:0,speed:20,accelerationTime:2500,decelerationTime:2500},this.defaultStyle={},this._defaultStyle={fontSize:"18px",fontColor:"#000",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",lineHeight:"",background:"#fff",wordWrap:!0,lengthLimit:"90%"},this.Radius=0,this.prizeRadius=0,this.prizeDeg=0,this.prizeRadian=0,this.rotateDeg=0,this.maxBtnRadius=0,this.startTime=0,this.endTime=0,this.stopDeg=0,this.endDeg=0,this.animationId=0,this.FPS=16.6,this.prizeImgs=[[]],this.btnImgs=[[]],this.box=document.querySelector(t),this.canvas=document.createElement("canvas"),this.box.appendChild(this.canvas),this.ctx=this.canvas.getContext("2d"),this.initData(i),this.initComputed(),this.initWatch();let e=[[]];this.prizes&&(e=this.prizes.map((t=>t.imgs))),this.buttons&&e.push(...this.buttons.map((t=>t.imgs))),this.init(e)}initData(t){this.$set(this,"blocks",t.blocks||[]),this.$set(this,"prizes",t.prizes||[]),this.$set(this,"buttons",t.buttons||[]),this.$set(this,"defaultConfig",t.defaultConfig||{}),this.$set(this,"defaultStyle",t.defaultStyle||{}),this.$set(this,"startCallback",t.start),this.$set(this,"endCallback",t.end)}initComputed(){this.$computed(this,"_defaultConfig",(()=>({gutter:"0px",offsetDegree:0,speed:20,accelerationTime:2500,decelerationTime:2500,...this.defaultConfig}))),this.$computed(this,"_defaultStyle",(()=>({fontSize:"18px",fontColor:"#000",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",background:"#fff",wordWrap:!0,lengthLimit:"90%",...this.defaultStyle})))}initWatch(){this.$watch("prizes",((t,i)=>{let e=[];return i?t&&t.forEach(((t,s)=>{let h=[];const n=i[s];n?t.imgs&&t.imgs.forEach(((t,i)=>{if(!n.imgs)return h[i]=t;const e=n.imgs[i];e&&this.prizeImgs[s]&&this.prizeImgs[s][i]?t.src!==e.src&&(h[i]=t):h[i]=t})):h=t.imgs||[],e[s]=h})):e=t.map((t=>t.imgs)),this.init(e)})),this.$watch("buttons",((t,i)=>{let e=[];return i?t&&t.forEach(((t,s)=>{let h=[];const n=i[s];n&&n.imgs?t.imgs&&t.imgs.forEach(((t,i)=>{if(!n.imgs)return h[i]=t;const e=n.imgs[i];e&&this.btnImgs[s]&&this.btnImgs[s][i]?t.src!==e.src&&(h[i]=t):h[i]=t})):h=t.imgs||[],e[s]=h})):e=t.map((t=>t.imgs)),this.init([...new Array(this.prizes.length).fill(void 0),...e])}))}init(t){this.setDpr(),this.setHTMLFontSize();const{box:i,canvas:s,ctx:h,dpr:n}=this;if(!i)return;s.width=s.height=i.offsetWidth*n,this.Radius=s.width/2,this.optimizeClarity(s,2*this.Radius,2*this.Radius),h.translate(this.Radius,this.Radius);const r=()=>{this.draw(),s.onclick=t=>{h.beginPath(),h.arc(0,0,this.maxBtnRadius,0,2*Math.PI,!1),h.isPointInPath(t.offsetX,t.offsetY)&&(this.startTime||this.startCallback?.(t))}};let o=0,a=0;e(t,"array")&&(this.draw(),t.forEach(((t,i)=>{if(!t)return!1;t.forEach(((t,e)=>{a++,this.loadAndCacheImg(i,e,(()=>{o++,a===o&&r.call(this)}))}))}))),a||r.call(this)}loadAndCacheImg(t,i,e){const s=t<this.prizes.length,h=s?"prizes":"buttons",n=s?"prizeImgs":"btnImgs";t=s?t:t-this.prizes.length;const r=this[h][t];if(!r||!r.imgs)return;const o=r.imgs[i];if(!o)return;let a=new Image;this[n][t]||(this[n][t]=[]),this[n][t][i]=a,a.src=o.src,a.onload=()=>e.call(this)}computedWidthAndHeight(t,i,e,s){if(!i.width&&!i.height)return[t.width,t.height];if(i.width&&!i.height){let s=this.getWidth(i.width,e);return[s,t.height*(s/t.width)]}if(!i.width&&i.height){let e=this.getHeight(i.height,s);return[t.width*(e/t.height),e]}return[this.getWidth(i.width,e),this.getHeight(i.height,s)]}draw(){const{ctx:t,dpr:i,_defaultConfig:e,_defaultStyle:r}=this;t.clearRect(-this.Radius,-this.Radius,2*this.Radius,2*this.Radius),this.prizeRadius=this.blocks.reduce(((e,s)=>(t.beginPath(),t.fillStyle=s.background,t.arc(0,0,e,0,2*Math.PI,!1),t.fill(),e-this.getLength(s.padding.split(" ")[0])*i)),this.Radius),this.prizeDeg=360/this.prizes.length,this.prizeRadian=h(this.prizeDeg);let a=h(-90+this.rotateDeg+e.offsetDegree);const l=i=>this.getOffsetX(t.measureText(i).width),d=(t,e,s)=>{const h=t.lineHeight||r.lineHeight||t.fontSize||r.fontSize;return this.getHeight(t.top,e)+(s+1)*this.getLength(h)*i};t.save(),this.prizes.forEach(((c,g)=>{let f=a+g*this.prizeRadian,u=this.prizeRadius-this.maxBtnRadius;((t,i,e,s,r,a,l)=>{i||(i=a);let d=h(90/Math.PI/e*a),c=h(90/Math.PI/i*a),g=s+d,f=r-d,u=s+c,m=r-c;t.beginPath(),t.fillStyle=l,t.moveTo(...n(g,e)),o(t,e,g,f,!0),m>u?o(t,i,u,m,!1):t.lineTo(...n((s+r)/2,a/2/Math.abs(Math.sin((s-r)/2)))),t.closePath(),t.fill()})(t,this.maxBtnRadius,this.prizeRadius,f-this.prizeRadian/2,f+this.prizeRadian/2,this.getLength(e.gutter)*i,c.background||r.background||"rgba(0, 0, 0, 0)");let m=Math.cos(f)*this.prizeRadius,p=Math.sin(f)*this.prizeRadius;t.translate(m,p),t.rotate(f+h(90)),c.imgs&&c.imgs.forEach(((i,e)=>{if(!this.prizeImgs[g])return;const s=this.prizeImgs[g][e];if(!s)return;const[h,n]=this.computedWidthAndHeight(s,i,this.prizeRadian*this.prizeRadius,u);t.drawImage(s,this.getOffsetX(h),this.getHeight(i.top,u),h,n)})),c.fonts&&c.fonts.forEach((h=>{let n=h.fontColor||r.fontColor,o=h.fontWeight||r.fontWeight,a=this.getLength(h.fontSize||r.fontSize),c=h.fontStyle||r.fontStyle;t.fillStyle=n,t.font=`${o} ${a*i}px ${c}`;let g=[],f=String(h.text);if(h.hasOwnProperty("wordWrap")?h.wordWrap:r.wordWrap){f=s(f);let n="";for(let s=0;s<f.length;s++){n+=f[s];let o=t.measureText(n).width,a=(this.prizeRadius-d(h,u,g.length))*Math.tan(this.prizeRadian/2)*2-this.getLength(e.gutter)*i;o>this.getWidth(h.lengthLimit||r.lengthLimit,a)&&(g.push(n.slice(0,-1)),n=f[s])}n&&g.push(n),g.length||g.push(f)}else g=f.split("\n");g.filter((t=>!!t)).forEach(((i,e)=>{t.fillText(i,l(i),d(h,u,e))}))})),t.rotate(h(360)-f-h(90)),t.translate(-m,-p)})),t.restore(),this.buttons.forEach(((e,s)=>{let h=this.getHeight(e.radius);this.maxBtnRadius=Math.max(this.maxBtnRadius,h),t.beginPath(),t.fillStyle=e.background||"rgba(0, 0, 0, 0)",t.arc(0,0,h,0,2*Math.PI,!1),t.fill(),e.pointer&&(t.beginPath(),t.fillStyle=e.background||"rgba(0, 0, 0, 0)",t.moveTo(-h,0),t.lineTo(h,0),t.lineTo(0,2*-h),t.closePath(),t.fill()),e.imgs&&e.imgs.forEach(((i,n)=>{if(!this.btnImgs[s])return;const r=this.btnImgs[s][n];if(!r)return;const[o,a]=this.computedWidthAndHeight(r,i,2*this.getHeight(e.radius),2*this.getHeight(e.radius));t.drawImage(r,this.getOffsetX(o),this.getHeight(i.top,h),o,a)})),e.fonts&&e.fonts.forEach((e=>{let s=e.fontColor||r.fontColor,n=e.fontWeight||r.fontWeight,o=this.getLength(e.fontSize||r.fontSize),a=e.fontStyle||r.fontStyle;t.fillStyle=s,t.font=`${n} ${o*i}px ${a}`,String(e.text).split("\n").forEach(((i,s)=>{t.fillText(i,l(i),d(e,h,s))}))}))}))}play(){this.startTime||(cancelAnimationFrame(this.animationId),this.startTime=Date.now(),this.prizeFlag=void 0,this.run())}stop(t){this.prizeFlag=Number(t)%this.prizes.length}run(t=0){const{prizeFlag:i,prizeDeg:e,rotateDeg:s,_defaultConfig:h}=this;let n=Date.now()-this.startTime;if(n>=h.accelerationTime&&void 0!==i)return this.FPS=n/t,this.endTime=Date.now(),this.stopDeg=s,this.endDeg=1800-i*e-s-h.offsetDegree,cancelAnimationFrame(this.animationId),this.slowDown();this.rotateDeg=(s+l(n,0,h.speed,h.accelerationTime))%360,this.draw(),this.animationId=window.requestAnimationFrame(this.run.bind(this,t+1))}slowDown(){const{prizes:t,prizeFlag:i,stopDeg:e,endDeg:s,_defaultConfig:h}=this;let n=Date.now()-this.endTime;if(n>=h.decelerationTime)return this.startTime=0,this.endCallback?.({...t.find(((t,e)=>e===i))}),cancelAnimationFrame(this.animationId);this.rotateDeg=d(n,e,s,h.decelerationTime)%360,this.draw(),this.animationId=window.requestAnimationFrame(this.slowDown.bind(this))}getLength(t){return e(t,"number")?t:e(t,"string")?this.changeUnits(t,{clean:!0}):0}getWidth(t,i=this.prizeRadian*this.prizeRadius){return e(t,"number")?t*this.dpr:e(t,"string")?this.changeUnits(t,{denominator:i}):0}getHeight(t,i=this.prizeRadius){return e(t,"number")?t*this.dpr:e(t,"string")?this.changeUnits(t,{denominator:i}):0}getOffsetX(t){return-t/2}},Object.defineProperty(t,"__esModule",{value:!0})}));
+!function(t,i){"object"==typeof exports&&"undefined"!=typeof module?i(exports):"function"==typeof define&&define.amd?define(["exports"],i):i((t="undefined"!=typeof globalThis?globalThis:t||self).LuckyCanvas={})}(this,(function(t){"use strict";class i{constructor(){this.htmlFontSize=16,this.dpr=1,this.subs={},this.setDpr(),this.setHTMLFontSize(),this.resetArrayPropo()}setDpr(){window.dpr=this.dpr=1.3*(window.devicePixelRatio||2)}setHTMLFontSize(){this.htmlFontSize=+getComputedStyle(document.documentElement).fontSize.slice(0,-2)}optimizeClarity(t,i,e){const{dpr:s}=this,h=t=>(t*s-t)/(t*s)*(s/2)*100;t.style.transform=`scale(${1/s}) translate(\n      ${-h(i)}%, ${-h(e)}%\n    )`}changeUnits(t,{denominator:i=1,clean:e=!1}){return Number(t.replace(/^(\-*[0-9.]*)([a-z%]*)$/,((t,s,h)=>{switch(h){case"%":s*=i/100;break;case"px":s*=1;break;case"rem":s*=this.htmlFontSize;break;default:s*=1}return e||"%"===h?s:s*this.dpr})))}draw(){}observer(t){t&&"object"==typeof t&&Object.keys(t).forEach((i=>{this.defineReactive(t,i,t[i])}))}defineReactive(t,i,e){this.observer(e),Object.defineProperty(t,i,{get:()=>e,set:t=>{let s=e;t!==e&&(e=t,this.observer(e),this.subs[i]&&this.subs[i].call(this,e,s),this.draw())}})}$set(t,i,e){t&&"object"==typeof t&&this.defineReactive(t,i,e)}$computed(t,i,e){Object.defineProperty(t,i,{get:()=>e.call(this)})}$watch(t,i){this.subs[t]=i}resetArrayPropo(){const t=this,i=Array.prototype,e=Object.create(i);["push","pop","shift","unshift","sort","splice","reverse"].forEach((s=>{e[s]=function(){t.draw(),i[s].call(this,...arguments)}}))}}const e=(t,...i)=>i.some((i=>Object.prototype.toString.call(t).slice(8,-1).toLowerCase()===i)),s=t=>[].filter.call(t,(t=>"\n"!==t)).join(""),h=t=>Math.PI/180*t,n=(t,i)=>[+(Math.cos(t)*i).toFixed(8),+(Math.sin(t)*i).toFixed(8)],r=(t,i)=>{let e=-t/i;return[e,-e*t+i]},o=(t,i,e,s,a=!0)=>{if(Math.abs(s-e).toFixed(8)>=h(180).toFixed(8)){let h=(s+e)/2;return a?(o(t,i,e,h,a),o(t,i,h,s,a)):(o(t,i,h,s,a),o(t,i,e,h,a)),!1}a||([e,s]=[s,e]);const[l,d]=n(e,i),[c,g]=n(s,i),[f,u]=r(l,d),[m,p]=r(c,g);let b=(p-u)/(f-m),w=(m*u-f*p)/(m-f);isNaN(b)&&(Math.abs(l)===+i.toFixed(8)&&(b=l),Math.abs(c)===+i.toFixed(8)&&(b=c)),f===1/0||f===-1/0?w=m*b+p:m!==1/0&&m!==-1/0||(w=f*b+u),t.lineTo(l,d),t.arcTo(b,w,c,g,i)},a=(t,i,e,s,h,n,r)=>{let o=Math.min(s,h);n>o/2&&(n=o/2),t.beginPath(),t.fillStyle=r,t.moveTo(i+n,e),t.lineTo(i+n,e),t.lineTo(i+s-n,e),t.arcTo(i+s,e,i+s,e+n,n),t.lineTo(i+s,e+h-n),t.arcTo(i+s,e+h,i+s-n,e+h,n),t.lineTo(i+n,e+h),t.arcTo(i,e+h,i,e+h-n,n),t.lineTo(i,e+n),t.arcTo(i,e,i+n,e,n),t.closePath(),t.fill()},l=function(t,i,e,s){return t>=s&&(t=s),e*(t/=s)*t+i},d=function(t,i,e,s){return t>=s&&(t=s),-e*(t/=s)*(t-2)+i};t.LuckyGrid=class extends i{constructor(t,i={}){super(),this.rows=3,this.cols=3,this.blocks=[],this.prizes=[],this.defaultConfig={},this._defaultConfig={gutter:5,speed:20,accelerationTime:2500,decelerationTime:2500},this.defaultStyle={},this._defaultStyle={borderRadius:20,fontColor:"#000",fontSize:"18px",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",lineHeight:"",background:"#fff",shadow:"",wordWrap:!0,lengthLimit:"90%"},this.activeStyle={},this._activeStyle={background:"#ffce98",shadow:"",fontStyle:"",fontWeight:"",fontSize:"",lineHeight:"",fontColor:""},this.boxWidth=0,this.boxHeight=0,this.cellWidth=0,this.cellHeight=0,this.startTime=0,this.endTime=0,this.currIndex=0,this.stopIndex=0,this.endIndex=0,this.demo=!1,this.timer=0,this.animationId=0,this.FPS=16.6,this.cells=[],this.cellImgs=[],this.box=document.querySelector(t),this.canvas=document.createElement("canvas"),this.box.appendChild(this.canvas),this.ctx=this.canvas.getContext("2d"),this.initData(i),this.initComputed(),this.initWatch();let e=[[]];this.prizes&&(e=this.prizes.map((t=>t.imgs))),this.button&&(e[this.cols*this.rows-1]=this.button.imgs),this.init(e)}initData(t){this.$set(this,"rows",Number(t.rows)||3),this.$set(this,"cols",Number(t.cols)||3),this.$set(this,"blocks",t.blocks||[]),this.$set(this,"prizes",t.prizes||[]),this.$set(this,"button",t.button),this.$set(this,"defaultConfig",t.defaultConfig||{}),this.$set(this,"defaultStyle",t.defaultStyle||{}),this.$set(this,"activeStyle",t.activeStyle||{}),this.$set(this,"startCallback",t.start),this.$set(this,"endCallback",t.end)}initComputed(){this.$computed(this,"_defaultConfig",(()=>{const t={gutter:5,speed:20,accelerationTime:2500,decelerationTime:2500,...this.defaultConfig};return t.gutter=this.getLength(t.gutter)*this.dpr,t.speed=t.speed/40,t})),this.$computed(this,"_defaultStyle",(()=>({borderRadius:20,fontColor:"#000",fontSize:"18px",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",background:"#fff",shadow:"",wordWrap:!0,lengthLimit:"90%",...this.defaultStyle}))),this.$computed(this,"_activeStyle",(()=>({background:"#ffce98",shadow:"",...this.activeStyle})))}initWatch(){this.$watch("prizes",((t,i)=>{let e=[];return i?t&&t.forEach(((t,s)=>{let h=[];const n=i[s];n?t.imgs&&t.imgs.forEach(((t,i)=>{if(!n.imgs)return h[i]=t;const e=n.imgs[i];e&&this.cellImgs[s][i]?t.src!==e.src&&(h[i]=t):h[i]=t})):h=t.imgs||[],e[s]=h})):e=t.map((t=>t.imgs)),this.init(e)})),this.$watch("button",((t,i)=>{let e=[],s=this.cols*this.rows-1;if(i&&i.imgs){if(t.imgs){const h=[];t.imgs.forEach(((t,e)=>{if(!i.imgs)return h[e]=t;const n=i.imgs[e];n&&this.cellImgs[s][e]?t.src!==n.src&&(h[e]=t):h[e]=t})),e[s]=h}}else e[s]=t.imgs;return this.init(e)}))}init(t){this.setDpr(),this.setHTMLFontSize();const{box:i,canvas:s,dpr:h}=this;if(!i)return;this.boxWidth=s.width=i.offsetWidth*h,this.boxHeight=s.height=i.offsetHeight*h,this.optimizeClarity(s,this.boxWidth,this.boxHeight);const n=()=>{this.draw(),this.demo&&this.walk(),this.button&&(s.onclick=t=>{const[i,e,s,h]=this.getGeometricProperty([this.button.x,this.button.y,this.button.col||1,this.button.row||1]);if(t.offsetX<i||t.offsetY<e||t.offsetX>i+s||t.offsetY>e+h)return!1;this.startTime||this.startCallback?.(t)})};let r=0,o=0;e(t,"array")&&(this.draw(),t.forEach(((t,i)=>{if(!t)return!1;t.forEach(((t,e)=>{o++,this.loadAndCacheImg(i,e,(()=>{r++,o===r&&n.call(this)}))}))}))),o||n.call(this)}loadAndCacheImg(t,i,e){const s=this.cells[t];if(!s||!s.imgs)return;const h=s.imgs[i];this.cellImgs[t]||(this.cellImgs[t]=[]);let n=new Image;this.cellImgs[t][i]={defaultImg:n},n.src=h.src;let r=0,o=1;if(n.onload=()=>{r++,r===o&&e.call(this)},!h.hasOwnProperty("activeSrc"))return;o++;let a=new Image;this.cellImgs[t][i].activeImg=a,a.src=h.activeSrc,a.onload=()=>{r++,r===o&&e.call(this)}}computedWidthAndHeight(t,i,e){if(!i.width&&!i.height)return[t.width,t.height];if(i.width&&!i.height){let s=this.getWidth(i.width,e.col);return[s,t.height*(s/t.width)]}if(!i.width&&i.height){let s=this.getHeight(i.height,e.row);return[t.width*(s/t.height),s]}return[this.getWidth(i.width,e.col),this.getHeight(i.height,e.row)]}draw(){const{ctx:t,dpr:i,_defaultConfig:h,_defaultStyle:n,_activeStyle:r}=this;t.clearRect(0,0,this.boxWidth,this.boxWidth),this.cells=[...this.prizes],this.button&&(this.cells[this.cols*this.rows-1]=this.button),this.cells.forEach((t=>{t.col=t.col||1,t.row=t.row||1})),this.prizeArea=this.blocks.reduce((({x:s,y:h,w:n,h:r},o)=>{const[l,d,c,g]=(t=>{let i=t.padding.replace(/px/g,"").split(" ").map((t=>~~t))||[0],s=0,h=0,n=0,r=0;switch(i.length){case 1:s=h=n=r=i[0];break;case 2:s=h=i[0],n=r=i[1];break;case 3:s=i[0],n=r=i[1],h=i[2];break;default:s=i[0],h=i[1],n=i[2],r=i[3]}const o={paddingTop:s,paddingBottom:h,paddingLeft:n,paddingRight:r};for(let i in o)o[i]=t.hasOwnProperty(i)&&e(t[i],"string","number")?~~String(t[i]).replace(/px/g,""):o[i];return[s,h,n,r]})(o).map((t=>t*i)),f=o.borderRadius?this.getLength(o.borderRadius)*i:0;return a(t,s,h,n,r,f,this.handleBackground(s,h,n,r,o.background)),{x:s+c,y:h+l,w:n-c-g,h:r-l-d}}),{x:0,y:0,w:this.boxWidth,h:this.boxHeight}),this.cellWidth=(this.prizeArea.w-h.gutter*(this.cols-1))/this.cols,this.cellHeight=(this.prizeArea.h-h.gutter*(this.rows-1))/this.rows,this.cells.forEach(((e,h)=>{let[o,l,d,c]=this.getGeometricProperty([e.x,e.y,e.col,e.row]);const g=h===this.currIndex%this.prizes.length>>0,f=(g?r.shadow:e.shadow||n.shadow).replace(/px/g,"").split(",")[0].split(" ").map(((t,e)=>e<3?Number(t)*i:t));4===f.length&&(t.shadowColor=f[3],t.shadowOffsetX=f[0],t.shadowOffsetY=f[1],t.shadowBlur=f[2],f[0]>0?d-=f[0]:(d+=f[0],o-=f[0]),f[1]>0?c-=f[1]:(c+=f[1],l-=f[1])),a(t,o,l,d,c,this.getLength(e.borderRadius?e.borderRadius:n.borderRadius)*i,this.handleBackground(o,l,d,c,e.background,g)),t.shadowColor="rgba(255, 255, 255, 0)",t.shadowOffsetX=0,t.shadowOffsetY=0,t.shadowBlur=0,e.imgs&&e.imgs.forEach(((i,s)=>{if(!this.cellImgs[h])return!1;const n=this.cellImgs[h][s];if(!n)return!1;const r=g&&n.activeImg||n.defaultImg,[a,d]=this.computedWidthAndHeight(r,i,e);t.drawImage(r,o+this.getOffsetX(a,e.col),l+this.getHeight(i.top,e.row),a,d)})),e.fonts&&e.fonts.forEach((h=>{let a=g&&r.fontStyle?r.fontStyle:h.fontStyle||n.fontStyle,d=g&&r.fontWeight?r.fontWeight:h.fontWeight||n.fontWeight,c=g&&r.fontSize?this.getLength(r.fontSize):this.getLength(h.fontSize||n.fontSize);const f=g&&r.lineHeight?r.lineHeight:h.lineHeight||n.lineHeight||h.fontSize||n.fontSize;t.font=`${d} ${c*i}px ${a}`,t.fillStyle=g&&r.fontColor?r.fontColor:h.fontColor||n.fontColor;let u=[],m=String(h.text);if(h.hasOwnProperty("wordWrap")?h.wordWrap:n.wordWrap){m=s(m);let i="";for(let s=0;s<m.length;s++){i+=m[s],t.measureText(i).width>this.getWidth(h.lengthLimit||n.lengthLimit,e.col)&&(u.push(i.slice(0,-1)),i=m[s])}i&&u.push(i),u.length||u.push(m)}else u=m.split("\n");u.forEach(((s,n)=>{t.fillText(s,o+this.getOffsetX(t.measureText(s).width,e.col),l+this.getHeight(h.top,e.row)+(n+1)*this.getLength(f)*i)}))}))}))}handleBackground(t,i,e,s,h,n=!1){const{ctx:r,_defaultStyle:o,_activeStyle:a}=this;return(h=n?a.background:h||o.background).includes("linear-gradient")&&(h=((t,i,e,s,h,n)=>{const r=/linear-gradient\((.+)\)/.exec(n)[1].split(",").map((t=>t.trim()));let o=r.shift(),a=[0,0,0,0];if(o.includes("deg")){o=o.slice(0,-3)%360;const t=t=>Math.tan(t/180*Math.PI);o>=0&&o<45?a=[i,e+h,i+s,e+h-s*t(o-0)]:o>=45&&o<90?a=[i,e+h,i+s-h*t(o-45),e]:o>=90&&o<135?a=[i+s,e+h,i+s-h*t(o-90),e]:o>=135&&o<180?a=[i+s,e+h,i,e+s*t(o-135)]:o>=180&&o<225?a=[i+s,e,i,e+s*t(o-180)]:o>=225&&o<270?a=[i+s,e,i+h*t(o-225),e+h]:o>=270&&o<315?a=[i,e,i+h*t(o-270),e+h]:o>=315&&o<360&&(a=[i,e,i+s,e+h-s*t(o-315)])}else o.includes("top")?a=[i,e+h,i,e]:o.includes("bottom")?a=[i,e,i,e+h]:o.includes("left")?a=[i+s,e,i,e]:o.includes("right")&&(a=[i,e,i+s,e]);const l=t.createLinearGradient(...a.map((t=>t>>0)));return r.reduce(((t,i,e)=>{const s=i.split(" ");return 1===s.length?t.addColorStop(e,s[0]):2===s.length&&t.addColorStop(...s),t}),l)})(r,t,i,e,s,h)),h}play(){this.startTime||(clearInterval(this.timer),cancelAnimationFrame(this.animationId),this.startTime=Date.now(),this.prizeFlag=void 0,this.run())}stop(t){this.prizeFlag=t%this.prizes.length}run(t=0){const{currIndex:i,prizes:e,prizeFlag:s,startTime:h,_defaultConfig:n}=this;let r=Date.now()-h;if(r>=n.accelerationTime&&void 0!==s){this.FPS=r/t,this.endTime=Date.now(),this.stopIndex=i;let h=0;for(;++h;){const t=e.length*h+s-(i>>0);if(d(this.FPS,this.stopIndex,t,n.decelerationTime)-this.stopIndex>n.speed){this.endIndex=t;break}}return cancelAnimationFrame(this.animationId),this.slowDown()}this.currIndex=(i+l(r,.1,n.speed,n.accelerationTime))%e.length,this.draw(),this.animationId=window.requestAnimationFrame(this.run.bind(this,t+1))}slowDown(){const{prizes:t,prizeFlag:i,stopIndex:e,endIndex:s,_defaultConfig:h}=this;let n=Date.now()-this.endTime;if(n>h.decelerationTime)return this.startTime=0,this.endCallback?.({...t.find(((t,e)=>e===i))}),cancelAnimationFrame(this.animationId);this.currIndex=d(n,e,s,h.decelerationTime)%t.length,this.draw(),this.animationId=window.requestAnimationFrame(this.slowDown.bind(this))}walk(){clearInterval(this.timer),this.timer=window.setInterval((()=>{this.currIndex+=1,this.draw()}),1300)}getGeometricProperty([t,i,e,s]){const{cellWidth:h,cellHeight:n}=this,r=this._defaultConfig.gutter;let o=[this.prizeArea.x+(h+r)*t,this.prizeArea.y+(n+r)*i];return e&&s&&o.push(h*e+r*(e-1),n*s+r*(s-1)),o}getLength(t){return e(t,"number")?t:e(t,"string")?this.changeUnits(t,{clean:!0}):0}getWidth(t,i=1){return e(t,"number")?t*this.dpr:e(t,"string")?this.changeUnits(t,{denominator:this.cellWidth*i+this._defaultConfig.gutter*(i-1)}):0}getHeight(t,i=1){return e(t,"number")?t*this.dpr:e(t,"string")?this.changeUnits(t,{denominator:this.cellHeight*i+this._defaultConfig.gutter*(i-1)}):0}getOffsetX(t,i=1){return(this.cellWidth*i+this._defaultConfig.gutter*(i-1)-t)/2}},t.LuckyWheel=class extends i{constructor(t,i={}){super(),this.blocks=[],this.prizes=[],this.buttons=[],this.defaultConfig={},this._defaultConfig={gutter:"0px",offsetDegree:0,speed:20,accelerationTime:2500,decelerationTime:2500},this.defaultStyle={},this._defaultStyle={fontSize:"18px",fontColor:"#000",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",lineHeight:"",background:"#fff",wordWrap:!0,lengthLimit:"90%"},this.Radius=0,this.prizeRadius=0,this.prizeDeg=0,this.prizeRadian=0,this.rotateDeg=0,this.maxBtnRadius=0,this.startTime=0,this.endTime=0,this.stopDeg=0,this.endDeg=0,this.animationId=0,this.FPS=16.6,this.prizeImgs=[[]],this.btnImgs=[[]],this.box=document.querySelector(t),this.canvas=document.createElement("canvas"),this.box.appendChild(this.canvas),this.ctx=this.canvas.getContext("2d"),this.initData(i),this.initComputed(),this.initWatch();let e=[[]];this.prizes&&(e=this.prizes.map((t=>t.imgs))),this.buttons&&e.push(...this.buttons.map((t=>t.imgs))),this.init(e)}initData(t){this.$set(this,"blocks",t.blocks||[]),this.$set(this,"prizes",t.prizes||[]),this.$set(this,"buttons",t.buttons||[]),this.$set(this,"defaultConfig",t.defaultConfig||{}),this.$set(this,"defaultStyle",t.defaultStyle||{}),this.$set(this,"startCallback",t.start),this.$set(this,"endCallback",t.end)}initComputed(){this.$computed(this,"_defaultConfig",(()=>({gutter:"0px",offsetDegree:0,speed:20,accelerationTime:2500,decelerationTime:2500,...this.defaultConfig}))),this.$computed(this,"_defaultStyle",(()=>({fontSize:"18px",fontColor:"#000",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",background:"#fff",wordWrap:!0,lengthLimit:"90%",...this.defaultStyle})))}initWatch(){this.$watch("prizes",((t,i)=>{let e=[];return i?t&&t.forEach(((t,s)=>{let h=[];const n=i[s];n?t.imgs&&t.imgs.forEach(((t,i)=>{if(!n.imgs)return h[i]=t;const e=n.imgs[i];e&&this.prizeImgs[s]&&this.prizeImgs[s][i]?t.src!==e.src&&(h[i]=t):h[i]=t})):h=t.imgs||[],e[s]=h})):e=t.map((t=>t.imgs)),this.init(e)})),this.$watch("buttons",((t,i)=>{let e=[];return i?t&&t.forEach(((t,s)=>{let h=[];const n=i[s];n&&n.imgs?t.imgs&&t.imgs.forEach(((t,i)=>{if(!n.imgs)return h[i]=t;const e=n.imgs[i];e&&this.btnImgs[s]&&this.btnImgs[s][i]?t.src!==e.src&&(h[i]=t):h[i]=t})):h=t.imgs||[],e[s]=h})):e=t.map((t=>t.imgs)),this.init([...new Array(this.prizes.length).fill(void 0),...e])}))}init(t){this.setDpr(),this.setHTMLFontSize();const{box:i,canvas:s,ctx:h,dpr:n}=this;if(!i)return;s.width=s.height=i.offsetWidth*n,this.Radius=s.width/2,this.optimizeClarity(s,2*this.Radius,2*this.Radius),h.translate(this.Radius,this.Radius);const r=()=>{this.draw(),s.onclick=t=>{h.beginPath(),h.arc(0,0,this.maxBtnRadius,0,2*Math.PI,!1),h.isPointInPath(t.offsetX,t.offsetY)&&(this.startTime||this.startCallback?.(t))}};let o=0,a=0;e(t,"array")&&(this.draw(),t.forEach(((t,i)=>{if(!t)return!1;t.forEach(((t,e)=>{a++,this.loadAndCacheImg(i,e,(()=>{o++,a===o&&r.call(this)}))}))}))),a||r.call(this)}loadAndCacheImg(t,i,e){const s=t<this.prizes.length,h=s?"prizes":"buttons",n=s?"prizeImgs":"btnImgs";t=s?t:t-this.prizes.length;const r=this[h][t];if(!r||!r.imgs)return;const o=r.imgs[i];if(!o)return;let a=new Image;this[n][t]||(this[n][t]=[]),this[n][t][i]=a,a.src=o.src,a.onload=()=>e.call(this)}computedWidthAndHeight(t,i,e,s){if(!i.width&&!i.height)return[t.width,t.height];if(i.width&&!i.height){let s=this.getWidth(i.width,e);return[s,t.height*(s/t.width)]}if(!i.width&&i.height){let e=this.getHeight(i.height,s);return[t.width*(e/t.height),e]}return[this.getWidth(i.width,e),this.getHeight(i.height,s)]}draw(){const{ctx:t,dpr:i,_defaultConfig:e,_defaultStyle:r}=this;t.clearRect(-this.Radius,-this.Radius,2*this.Radius,2*this.Radius),this.prizeRadius=this.blocks.reduce(((e,s)=>(t.beginPath(),t.fillStyle=s.background,t.arc(0,0,e,0,2*Math.PI,!1),t.fill(),e-this.getLength(s.padding.split(" ")[0])*i)),this.Radius),this.prizeDeg=360/this.prizes.length,this.prizeRadian=h(this.prizeDeg);let a=h(-90+this.rotateDeg+e.offsetDegree);const l=i=>this.getOffsetX(t.measureText(i).width),d=(t,e,s)=>{const h=t.lineHeight||r.lineHeight||t.fontSize||r.fontSize;return this.getHeight(t.top,e)+(s+1)*this.getLength(h)*i};t.save(),this.prizes.forEach(((c,g)=>{let f=a+g*this.prizeRadian,u=this.prizeRadius-this.maxBtnRadius;((t,i,e,s,r,a,l)=>{i||(i=a);let d=h(90/Math.PI/e*a),c=h(90/Math.PI/i*a),g=s+d,f=r-d,u=s+c,m=r-c;t.beginPath(),t.fillStyle=l,t.moveTo(...n(g,e)),o(t,e,g,f,!0),m>u?o(t,i,u,m,!1):t.lineTo(...n((s+r)/2,a/2/Math.abs(Math.sin((s-r)/2)))),t.closePath(),t.fill()})(t,this.maxBtnRadius,this.prizeRadius,f-this.prizeRadian/2,f+this.prizeRadian/2,this.getLength(e.gutter)*i,c.background||r.background||"rgba(0, 0, 0, 0)");let m=Math.cos(f)*this.prizeRadius,p=Math.sin(f)*this.prizeRadius;t.translate(m,p),t.rotate(f+h(90)),c.imgs&&c.imgs.forEach(((i,e)=>{if(!this.prizeImgs[g])return;const s=this.prizeImgs[g][e];if(!s)return;const[h,n]=this.computedWidthAndHeight(s,i,this.prizeRadian*this.prizeRadius,u);t.drawImage(s,this.getOffsetX(h),this.getHeight(i.top,u),h,n)})),c.fonts&&c.fonts.forEach((h=>{let n=h.fontColor||r.fontColor,o=h.fontWeight||r.fontWeight,a=this.getLength(h.fontSize||r.fontSize),c=h.fontStyle||r.fontStyle;t.fillStyle=n,t.font=`${o} ${a*i}px ${c}`;let g=[],f=String(h.text);if(h.hasOwnProperty("wordWrap")?h.wordWrap:r.wordWrap){f=s(f);let n="";for(let s=0;s<f.length;s++){n+=f[s];let o=t.measureText(n).width,a=(this.prizeRadius-d(h,u,g.length))*Math.tan(this.prizeRadian/2)*2-this.getLength(e.gutter)*i;o>this.getWidth(h.lengthLimit||r.lengthLimit,a)&&(g.push(n.slice(0,-1)),n=f[s])}n&&g.push(n),g.length||g.push(f)}else g=f.split("\n");g.filter((t=>!!t)).forEach(((i,e)=>{t.fillText(i,l(i),d(h,u,e))}))})),t.rotate(h(360)-f-h(90)),t.translate(-m,-p)})),t.restore(),this.buttons.forEach(((e,s)=>{let h=this.getHeight(e.radius);this.maxBtnRadius=Math.max(this.maxBtnRadius,h),t.beginPath(),t.fillStyle=e.background||"rgba(0, 0, 0, 0)",t.arc(0,0,h,0,2*Math.PI,!1),t.fill(),e.pointer&&(t.beginPath(),t.fillStyle=e.background||"rgba(0, 0, 0, 0)",t.moveTo(-h,0),t.lineTo(h,0),t.lineTo(0,2*-h),t.closePath(),t.fill()),e.imgs&&e.imgs.forEach(((i,n)=>{if(!this.btnImgs[s])return;const r=this.btnImgs[s][n];if(!r)return;const[o,a]=this.computedWidthAndHeight(r,i,2*this.getHeight(e.radius),2*this.getHeight(e.radius));t.drawImage(r,this.getOffsetX(o),this.getHeight(i.top,h),o,a)})),e.fonts&&e.fonts.forEach((e=>{let s=e.fontColor||r.fontColor,n=e.fontWeight||r.fontWeight,o=this.getLength(e.fontSize||r.fontSize),a=e.fontStyle||r.fontStyle;t.fillStyle=s,t.font=`${n} ${o*i}px ${a}`,String(e.text).split("\n").forEach(((i,s)=>{t.fillText(i,l(i),d(e,h,s))}))}))}))}play(){this.startTime||(cancelAnimationFrame(this.animationId),this.startTime=Date.now(),this.prizeFlag=void 0,this.run())}stop(t){this.prizeFlag=Number(t)%this.prizes.length}run(t=0){const{prizeFlag:i,prizeDeg:e,rotateDeg:s,_defaultConfig:h}=this;let n=Date.now()-this.startTime;if(n>=h.accelerationTime&&void 0!==i){this.FPS=n/t,this.endTime=Date.now(),this.stopDeg=s;let r=0;for(;++r;){const t=360*r-i*e-s-h.offsetDegree;if(d(this.FPS,this.stopDeg,t,h.decelerationTime)-this.stopDeg>h.speed){this.endDeg=t;break}}return cancelAnimationFrame(this.animationId),this.slowDown()}this.rotateDeg=(s+l(n,0,h.speed,h.accelerationTime))%360,this.draw(),this.animationId=window.requestAnimationFrame(this.run.bind(this,t+1))}slowDown(){const{prizes:t,prizeFlag:i,stopDeg:e,endDeg:s,_defaultConfig:h}=this;let n=Date.now()-this.endTime;if(n>=h.decelerationTime)return this.startTime=0,this.endCallback?.({...t.find(((t,e)=>e===i))}),cancelAnimationFrame(this.animationId);this.rotateDeg=d(n,e,s,h.decelerationTime)%360,this.draw(),this.animationId=window.requestAnimationFrame(this.slowDown.bind(this))}getLength(t){return e(t,"number")?t:e(t,"string")?this.changeUnits(t,{clean:!0}):0}getWidth(t,i=this.prizeRadian*this.prizeRadius){return e(t,"number")?t*this.dpr:e(t,"string")?this.changeUnits(t,{denominator:i}):0}getHeight(t,i=this.prizeRadius){return e(t,"number")?t*this.dpr:e(t,"string")?this.changeUnits(t,{denominator:i}):0}getOffsetX(t){return-t/2}},Object.defineProperty(t,"__esModule",{value:!0})}));

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

196431

increased by1.11%

Lines of code

3296

increased by1.07%

No dependency changes