lucky-canvas - npm Package Compare versions

Comparing version 1.0.4 to 1.0.5

dist/lucky-canvas.cjs.min.js

@@ -1,1 +0,16 @@
-"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}};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});
+/*! *****************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+var t=function(i,e){return(t=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,i){t.__proto__=i}||function(t,i){for(var e in i)Object.prototype.hasOwnProperty.call(i,e)&&(t[e]=i[e])})(i,e)};function i(i,e){function n(){this.constructor=i}t(i,e),i.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}var e=function(){return(e=Object.assign||function(t){for(var i,e=1,n=arguments.length;e<n;e++)for(var r in i=arguments[e])Object.prototype.hasOwnProperty.call(i,r)&&(t[r]=i[r]);return t}).apply(this,arguments)};function n(){for(var t=0,i=0,e=arguments.length;i<e;i++)t+=arguments[i].length;var n=Array(t),r=0;for(i=0;i<e;i++)for(var o=arguments[i],s=0,a=o.length;s<a;s++,r++)n[r]=o[s];return n}var r=function(){function t(t){this.htmlFontSize=16,this.dpr=1,this.subs={},this.setDpr(),this.setHTMLFontSize(),this.resetArrayPropo(),this.box="string"==typeof t?document.querySelector(t):t,this.canvas=document.createElement("canvas"),this.box.appendChild(this.canvas),this.ctx=this.canvas.getContext("2d")}return t.prototype.setDpr=function(){window.dpr=this.dpr=1.3*(window.devicePixelRatio||2)},t.prototype.setHTMLFontSize=function(){this.htmlFontSize=+getComputedStyle(document.documentElement).fontSize.slice(0,-2)},t.prototype.optimizeClarity=function(t,i,e){var n=this.dpr,r=function(t){return(t*n-t)/(t*n)*(n/2)*100};t.style.transform="scale("+1/n+") translate(\n      "+-r(i)+"%, "+-r(e)+"%\n    )"},t.prototype.changeUnits=function(t,i){var e=this,n=i.denominator,r=void 0===n?1:n,o=i.clean,s=void 0!==o&&o;return Number(t.replace(/^(\-*[0-9.]*)([a-z%]*)$/,(function(t,i,n){switch(n){case"%":i*=r/100;break;case"px":i*=1;break;case"rem":i*=e.htmlFontSize;break;default:i*=1}return s||"%"===n?i:i*e.dpr})))},t.prototype.draw=function(){},t.prototype.observer=function(t){var i=this;t&&"object"==typeof t&&Object.keys(t).forEach((function(e){i.defineReactive(t,e,t[e])}))},t.prototype.defineReactive=function(t,i,e){var n=this;this.observer(e),Object.defineProperty(t,i,{get:function(){return e},set:function(t){var r=e;t!==e&&(e=t,n.observer(e),n.subs[i]&&n.subs[i].call(n,e,r),n.draw())}})},t.prototype.$set=function(t,i,e){t&&"object"==typeof t&&this.defineReactive(t,i,e)},t.prototype.$computed=function(t,i,e){var n=this;Object.defineProperty(t,i,{get:function(){return e.call(n)}})},t.prototype.$watch=function(t,i){this.subs[t]=i},t.prototype.resetArrayPropo=function(){var t=this,i=Array.prototype,e=Object.create(i);["push","pop","shift","unshift","sort","splice","reverse"].forEach((function(r){e[r]=function(){var e;t.draw(),(e=i[r]).call.apply(e,n([this],Array.from(arguments)))}}))},t}(),o=function(t){for(var i=[],e=1;e<arguments.length;e++)i[e-1]=arguments[e];return i.some((function(i){return Object.prototype.toString.call(t).slice(8,-1).toLowerCase()===i}))},s=function(t){return[].filter.call(t,(function(t){return"\n"!==t})).join("")},a=function(t){return Math.PI/180*t},h=function(t,i){return[+(Math.cos(t)*i).toFixed(8),+(Math.sin(t)*i).toFixed(8)]},c=function(t,i){var e=-t/i;return[e,-e*t+i]},f=function(t,i,e,n,r){var o;if(void 0===r&&(r=!0),Math.abs(n-e).toFixed(8)>=a(180).toFixed(8)){var s=(n+e)/2;return r?(f(t,i,e,s,r),f(t,i,s,n,r)):(f(t,i,s,n,r),f(t,i,e,s,r)),!1}r||(e=(o=[n,e])[0],n=o[1]);var u=h(e,i),l=u[0],d=u[1],g=h(n,i),p=g[0],m=g[1],v=c(l,d),y=v[0],w=v[1],b=c(p,m),z=b[0],S=b[1],x=(S-w)/(y-z),I=(z*w-y*S)/(z-y);isNaN(x)&&(Math.abs(l)===+i.toFixed(8)&&(x=l),Math.abs(p)===+i.toFixed(8)&&(x=p)),y===1/0||y===-1/0?I=z*x+S:z!==1/0&&z!==-1/0||(I=y*x+w),t.lineTo(l,d),t.arcTo(x,I,p,m,i)},u=function(t,i,e,n,r,o,s){var a=Math.min(n,r);o>a/2&&(o=a/2),t.beginPath(),t.fillStyle=s,t.moveTo(i+o,e),t.lineTo(i+o,e),t.lineTo(i+n-o,e),t.arcTo(i+n,e,i+n,e+o,o),t.lineTo(i+n,e+r-o),t.arcTo(i+n,e+r,i+n-o,e+r,o),t.lineTo(i+o,e+r),t.arcTo(i,e+r,i,e+r-o,o),t.lineTo(i,e+o),t.arcTo(i,e,i+o,e,o),t.closePath(),t.fill()},l=function(t,i,e,n){return t>=n&&(t=n),e*(t/=n)*t+i},d=function(t,i,e,n){return t>=n&&(t=n),-e*(t/=n)*(t-2)+i},g=function(t){function r(i,e){void 0===e&&(e={});var n=t.call(this,i)||this;n.blocks=[],n.prizes=[],n.buttons=[],n.defaultConfig={},n._defaultConfig={gutter:"0px",offsetDegree:0,speed:20,accelerationTime:2500,decelerationTime:2500},n.defaultStyle={},n._defaultStyle={fontSize:"18px",fontColor:"#000",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",lineHeight:"",background:"#fff",wordWrap:!0,lengthLimit:"90%"},n.Radius=0,n.prizeRadius=0,n.prizeDeg=0,n.prizeRadian=0,n.rotateDeg=0,n.maxBtnRadius=0,n.startTime=0,n.endTime=0,n.stopDeg=0,n.endDeg=0,n.animationId=0,n.FPS=16.6,n.prizeImgs=[[]],n.btnImgs=[[]],n.initData(e),n.initComputed(),n.initWatch();var r=[[]];return n.prizes&&(r=n.prizes.map((function(t){return t.imgs}))),n.buttons&&r.push.apply(r,n.buttons.map((function(t){return t.imgs}))),n.init(r),n}return i(r,t),r.prototype.initData=function(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)},r.prototype.initComputed=function(){var t=this;this.$computed(this,"_defaultConfig",(function(){return e({gutter:"0px",offsetDegree:0,speed:20,accelerationTime:2500,decelerationTime:2500},t.defaultConfig)})),this.$computed(this,"_defaultStyle",(function(){return e({fontSize:"18px",fontColor:"#000",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",background:"#fff",wordWrap:!0,lengthLimit:"90%"},t.defaultStyle)}))},r.prototype.initWatch=function(){var t=this;this.$watch("prizes",(function(i,e){var n=[];return e?i&&i.forEach((function(i,r){var o=[],s=e[r];s?i.imgs&&i.imgs.forEach((function(i,e){if(!s.imgs)return o[e]=i;var n=s.imgs[e];n&&t.prizeImgs[r]&&t.prizeImgs[r][e]?i.src!==n.src&&(o[e]=i):o[e]=i})):o=i.imgs||[],n[r]=o})):n=i.map((function(t){return t.imgs})),t.init(n)})),this.$watch("buttons",(function(i,e){var r=[];return e?i&&i.forEach((function(i,n){var o=[],s=e[n];s&&s.imgs?i.imgs&&i.imgs.forEach((function(i,e){if(!s.imgs)return o[e]=i;var r=s.imgs[e];r&&t.btnImgs[n]&&t.btnImgs[n][e]?i.src!==r.src&&(o[e]=i):o[e]=i})):o=i.imgs||[],r[n]=o})):r=i.map((function(t){return t.imgs})),t.init(n(new Array(t.prizes.length).fill(void 0),r))}))},r.prototype.init=function(t){var i=this;this.setDpr(),this.setHTMLFontSize();var e=this,n=e.box,r=e.canvas,s=e.ctx,a=e.dpr;if(n){r.width=r.height=n.offsetWidth*a,this.Radius=r.width/2,this.optimizeClarity(r,2*this.Radius,2*this.Radius),s.translate(this.Radius,this.Radius);var h=function(){i.draw(),r.onclick=function(t){var e;s.beginPath(),s.arc(0,0,i.maxBtnRadius,0,2*Math.PI,!1),s.isPointInPath(t.offsetX,t.offsetY)&&(i.startTime||null===(e=i.startCallback)||void 0===e||e.call(i,t))}},c=0,f=0;o(t,"array")&&(this.draw(),t.forEach((function(t,e){if(!t)return!1;t.forEach((function(t,n){f++,i.loadAndCacheImg(e,n,(function(){c++,f===c&&h.call(i)}))}))}))),f||h.call(this)}},r.prototype.loadAndCacheImg=function(t,i,e){var n=this,r=t<this.prizes.length,o=r?"prizes":"buttons",s=r?"prizeImgs":"btnImgs";t=r?t:t-this.prizes.length;var a=this[o][t];if(a&&a.imgs){var h=a.imgs[i];if(h){var c=new Image;this[s][t]||(this[s][t]=[]),this[s][t][i]=c,c.src=h.src,c.onload=function(){return e.call(n)}}}},r.prototype.computedWidthAndHeight=function(t,i,e,n){if(!i.width&&!i.height)return[t.width,t.height];if(i.width&&!i.height){var r=this.getWidth(i.width,e);return[r,t.height*(r/t.width)]}if(!i.width&&i.height){var o=this.getHeight(i.height,n);return[t.width*(o/t.height),o]}return[this.getWidth(i.width,e),this.getHeight(i.height,n)]},r.prototype.draw=function(){var t=this,i=this,e=i.ctx,n=i.dpr,r=i._defaultConfig,o=i._defaultStyle;e.clearRect(-this.Radius,-this.Radius,2*this.Radius,2*this.Radius),this.prizeRadius=this.blocks.reduce((function(i,r){return e.beginPath(),e.fillStyle=r.background,e.arc(0,0,i,0,2*Math.PI,!1),e.fill(),i-t.getLength(r.padding.split(" ")[0])*n}),this.Radius),this.prizeDeg=360/this.prizes.length,this.prizeRadian=a(this.prizeDeg);var c=a(-90+this.rotateDeg+r.offsetDegree),u=function(i){return t.getOffsetX(e.measureText(i).width)},l=function(i,e,r){var s=i.lineHeight||o.lineHeight||i.fontSize||o.fontSize;return t.getHeight(i.top,e)+(r+1)*t.getLength(s)*n};e.save(),this.prizes.forEach((function(i,d){var g=c+d*t.prizeRadian,p=t.prizeRadius-t.maxBtnRadius;!function(t,i,e,n,r,o,s){i||(i=o);var c=a(90/Math.PI/e*o),u=a(90/Math.PI/i*o),l=n+c,d=r-c,g=n+u,p=r-u;t.beginPath(),t.fillStyle=s,t.moveTo.apply(t,h(l,e)),f(t,e,l,d,!0),p>g?f(t,i,g,p,!1):t.lineTo.apply(t,h((n+r)/2,o/2/Math.abs(Math.sin((n-r)/2)))),t.closePath(),t.fill()}(e,t.maxBtnRadius,t.prizeRadius,g-t.prizeRadian/2,g+t.prizeRadian/2,t.getLength(r.gutter)*n,i.background||o.background||"rgba(0, 0, 0, 0)");var m=Math.cos(g)*t.prizeRadius,v=Math.sin(g)*t.prizeRadius;e.translate(m,v),e.rotate(g+a(90)),i.imgs&&i.imgs.forEach((function(i,n){if(t.prizeImgs[d]){var r=t.prizeImgs[d][n];if(r){var o=t.computedWidthAndHeight(r,i,t.prizeRadian*t.prizeRadius,p),s=o[0],a=o[1];e.drawImage(r,t.getOffsetX(s),t.getHeight(i.top,p),s,a)}}})),i.fonts&&i.fonts.forEach((function(i){var a=i.fontColor||o.fontColor,h=i.fontWeight||o.fontWeight,c=t.getLength(i.fontSize||o.fontSize),f=i.fontStyle||o.fontStyle;e.fillStyle=a,e.font=h+" "+c*n+"px "+f;var d=[],g=String(i.text);if(i.hasOwnProperty("wordWrap")?i.wordWrap:o.wordWrap){g=s(g);for(var m="",v=0;v<g.length;v++){m+=g[v];var y=e.measureText(m).width,w=(t.prizeRadius-l(i,p,d.length))*Math.tan(t.prizeRadian/2)*2-t.getLength(r.gutter)*n;y>t.getWidth(i.lengthLimit||o.lengthLimit,w)&&(d.push(m.slice(0,-1)),m=g[v])}m&&d.push(m),d.length||d.push(g)}else d=g.split("\n");d.filter((function(t){return!!t})).forEach((function(t,n){e.fillText(t,u(t),l(i,p,n))}))})),e.rotate(a(360)-g-a(90)),e.translate(-m,-v)})),e.restore(),this.buttons.forEach((function(i,r){var s=t.getHeight(i.radius);t.maxBtnRadius=Math.max(t.maxBtnRadius,s),e.beginPath(),e.fillStyle=i.background||"rgba(0, 0, 0, 0)",e.arc(0,0,s,0,2*Math.PI,!1),e.fill(),i.pointer&&(e.beginPath(),e.fillStyle=i.background||"rgba(0, 0, 0, 0)",e.moveTo(-s,0),e.lineTo(s,0),e.lineTo(0,2*-s),e.closePath(),e.fill()),i.imgs&&i.imgs.forEach((function(n,o){if(t.btnImgs[r]){var a=t.btnImgs[r][o];if(a){var h=t.computedWidthAndHeight(a,n,2*t.getHeight(i.radius),2*t.getHeight(i.radius)),c=h[0],f=h[1];e.drawImage(a,t.getOffsetX(c),t.getHeight(n.top,s),c,f)}}})),i.fonts&&i.fonts.forEach((function(i){var r=i.fontColor||o.fontColor,a=i.fontWeight||o.fontWeight,h=t.getLength(i.fontSize||o.fontSize),c=i.fontStyle||o.fontStyle;e.fillStyle=r,e.font=a+" "+h*n+"px "+c,String(i.text).split("\n").forEach((function(t,n){e.fillText(t,u(t),l(i,s,n))}))}))}))},r.prototype.play=function(){this.startTime||(cancelAnimationFrame(this.animationId),this.startTime=Date.now(),this.prizeFlag=void 0,this.run())},r.prototype.stop=function(t){this.prizeFlag=Number(t)%this.prizes.length},r.prototype.run=function(t){void 0===t&&(t=0);var i=this,e=i.prizeFlag,n=i.prizeDeg,r=i.rotateDeg,o=i._defaultConfig,s=Date.now()-this.startTime;if(s>=o.accelerationTime&&void 0!==e){this.FPS=s/t,this.endTime=Date.now(),this.stopDeg=r;for(var a=0;++a;){var h=360*a-e*n-r-o.offsetDegree;if(d(this.FPS,this.stopDeg,h,o.decelerationTime)-this.stopDeg>o.speed){this.endDeg=h;break}}return cancelAnimationFrame(this.animationId),this.slowDown()}this.rotateDeg=(r+l(s,0,o.speed,o.accelerationTime))%360,this.draw(),this.animationId=window.requestAnimationFrame(this.run.bind(this,t+1))},r.prototype.slowDown=function(){var t,i=this,n=i.prizes,r=i.prizeFlag,o=i.stopDeg,s=i.endDeg,a=i._defaultConfig,h=Date.now()-this.endTime;if(h>=a.decelerationTime)return this.startTime=0,null===(t=this.endCallback)||void 0===t||t.call(this,e({},n.find((function(t,i){return i===r})))),cancelAnimationFrame(this.animationId);this.rotateDeg=d(h,o,s,a.decelerationTime)%360,this.draw(),this.animationId=window.requestAnimationFrame(this.slowDown.bind(this))},r.prototype.getLength=function(t){return o(t,"number")?t:o(t,"string")?this.changeUnits(t,{clean:!0}):0},r.prototype.getWidth=function(t,i){return void 0===i&&(i=this.prizeRadian*this.prizeRadius),o(t,"number")?t*this.dpr:o(t,"string")?this.changeUnits(t,{denominator:i}):0},r.prototype.getHeight=function(t,i){return void 0===i&&(i=this.prizeRadius),o(t,"number")?t*this.dpr:o(t,"string")?this.changeUnits(t,{denominator:i}):0},r.prototype.getOffsetX=function(t){return-t/2},r}(r),p=function(t){function r(i,e){void 0===e&&(e={});var n=t.call(this,i)||this;n.rows=3,n.cols=3,n.blocks=[],n.prizes=[],n.defaultConfig={},n._defaultConfig={gutter:5,speed:20,accelerationTime:2500,decelerationTime:2500},n.defaultStyle={},n._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%"},n.activeStyle={},n._activeStyle={background:"#ffce98",shadow:"",fontStyle:"",fontWeight:"",fontSize:"",lineHeight:"",fontColor:""},n.boxWidth=0,n.boxHeight=0,n.cellWidth=0,n.cellHeight=0,n.startTime=0,n.endTime=0,n.currIndex=0,n.stopIndex=0,n.endIndex=0,n.demo=!1,n.timer=0,n.animationId=0,n.FPS=16.6,n.cells=[],n.cellImgs=[],n.initData(e),n.initComputed(),n.initWatch();var r=[[]];return n.prizes&&(r=n.prizes.map((function(t){return t.imgs}))),n.button&&(r[n.cols*n.rows-1]=n.button.imgs),n.init(r),n}return i(r,t),r.prototype.initData=function(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)},r.prototype.initComputed=function(){var t=this;this.$computed(this,"_defaultConfig",(function(){var i=e({gutter:5,speed:20,accelerationTime:2500,decelerationTime:2500},t.defaultConfig);return i.gutter=t.getLength(i.gutter)*t.dpr,i.speed=i.speed/40,i})),this.$computed(this,"_defaultStyle",(function(){return e({borderRadius:20,fontColor:"#000",fontSize:"18px",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",background:"#fff",shadow:"",wordWrap:!0,lengthLimit:"90%"},t.defaultStyle)})),this.$computed(this,"_activeStyle",(function(){return e({background:"#ffce98",shadow:""},t.activeStyle)}))},r.prototype.initWatch=function(){var t=this;this.$watch("prizes",(function(i,e){var n=[];return e?i&&i.forEach((function(i,r){var o=[],s=e[r];s?i.imgs&&i.imgs.forEach((function(i,e){if(!s.imgs)return o[e]=i;var n=s.imgs[e];n&&t.cellImgs[r][e]?i.src!==n.src&&(o[e]=i):o[e]=i})):o=i.imgs||[],n[r]=o})):n=i.map((function(t){return t.imgs})),t.init(n)})),this.$watch("button",(function(i,e){var n=[],r=t.cols*t.rows-1;if(e&&e.imgs){if(i.imgs){var o=[];i.imgs.forEach((function(i,n){if(!e.imgs)return o[n]=i;var s=e.imgs[n];s&&t.cellImgs[r][n]?i.src!==s.src&&(o[n]=i):o[n]=i})),n[r]=o}}else n[r]=i.imgs;return t.init(n)}))},r.prototype.init=function(t){var i=this;this.setDpr(),this.setHTMLFontSize();var e=this,n=e.box,r=e.canvas,s=e.dpr;if(n){this.boxWidth=r.width=n.offsetWidth*s,this.boxHeight=r.height=n.offsetHeight*s,this.optimizeClarity(r,this.boxWidth,this.boxHeight);var a=function(){i.draw(),i.demo&&i.walk(),i.button&&(r.onclick=function(t){var e,n=i.getGeometricProperty([i.button.x,i.button.y,i.button.col||1,i.button.row||1]),r=n[0],o=n[1],s=n[2],a=n[3];if(t.offsetX<r||t.offsetY<o||t.offsetX>r+s||t.offsetY>o+a)return!1;i.startTime||null===(e=i.startCallback)||void 0===e||e.call(i,t)})},h=0,c=0;o(t,"array")&&(this.draw(),t.forEach((function(t,e){if(!t)return!1;t.forEach((function(t,n){c++,i.loadAndCacheImg(e,n,(function(){h++,c===h&&a.call(i)}))}))}))),c||a.call(this)}},r.prototype.loadAndCacheImg=function(t,i,e){var n=this,r=this.cells[t];if(r&&r.imgs){var o=r.imgs[i];this.cellImgs[t]||(this.cellImgs[t]=[]);var s=new Image;this.cellImgs[t][i]={defaultImg:s},s.src=o.src;var a=0,h=1;if(s.onload=function(){++a===h&&e.call(n)},o.hasOwnProperty("activeSrc")){h++;var c=new Image;this.cellImgs[t][i].activeImg=c,c.src=o.activeSrc,c.onload=function(){++a===h&&e.call(n)}}}},r.prototype.computedWidthAndHeight=function(t,i,e){if(!i.width&&!i.height)return[t.width,t.height];if(i.width&&!i.height){var n=this.getWidth(i.width,e.col);return[n,t.height*(n/t.width)]}if(!i.width&&i.height){var r=this.getHeight(i.height,e.row);return[t.width*(r/t.height),r]}return[this.getWidth(i.width,e.col),this.getHeight(i.height,e.row)]},r.prototype.draw=function(){var t=this,i=this,e=i.ctx,r=i.dpr,a=i._defaultConfig,h=i._defaultStyle,c=i._activeStyle;e.clearRect(0,0,this.boxWidth,this.boxWidth),this.cells=n(this.prizes),this.button&&(this.cells[this.cols*this.rows-1]=this.button),this.cells.forEach((function(t){t.col=t.col||1,t.row=t.row||1})),this.prizeArea=this.blocks.reduce((function(i,n){var s=i.x,a=i.y,h=i.w,c=i.h,f=function(t){var i=t.padding.replace(/px/g,"").split(" ").map((function(t){return~~t}))||[0],e=0,n=0,r=0,s=0;switch(i.length){case 1:e=n=r=s=i[0];break;case 2:e=n=i[0],r=s=i[1];break;case 3:e=i[0],r=s=i[1],n=i[2];break;default:e=i[0],n=i[1],r=i[2],s=i[3]}var a={paddingTop:e,paddingBottom:n,paddingLeft:r,paddingRight:s};for(var h in a)a[h]=t.hasOwnProperty(h)&&o(t[h],"string","number")?~~String(t[h]).replace(/px/g,""):a[h];return[e,n,r,s]}(n).map((function(t){return t*r})),l=f[0],d=f[1],g=f[2],p=f[3],m=n.borderRadius?t.getLength(n.borderRadius)*r:0;return u(e,s,a,h,c,m,t.handleBackground(s,a,h,c,n.background)),{x:s+g,y:a+l,w:h-g-p,h:c-l-d}}),{x:0,y:0,w:this.boxWidth,h:this.boxHeight}),this.cellWidth=(this.prizeArea.w-a.gutter*(this.cols-1))/this.cols,this.cellHeight=(this.prizeArea.h-a.gutter*(this.rows-1))/this.rows,this.cells.forEach((function(i,n){var o=t.getGeometricProperty([i.x,i.y,i.col,i.row]),a=o[0],f=o[1],l=o[2],d=o[3],g=n===t.currIndex%t.prizes.length>>0,p=(g?c.shadow:i.shadow||h.shadow).replace(/px/g,"").split(",")[0].split(" ").map((function(t,i){return i<3?Number(t)*r:t}));4===p.length&&(e.shadowColor=p[3],e.shadowOffsetX=p[0],e.shadowOffsetY=p[1],e.shadowBlur=p[2],p[0]>0?l-=p[0]:(l+=p[0],a-=p[0]),p[1]>0?d-=p[1]:(d+=p[1],f-=p[1])),u(e,a,f,l,d,t.getLength(i.borderRadius?i.borderRadius:h.borderRadius)*r,t.handleBackground(a,f,l,d,i.background,g)),e.shadowColor="rgba(255, 255, 255, 0)",e.shadowOffsetX=0,e.shadowOffsetY=0,e.shadowBlur=0,i.imgs&&i.imgs.forEach((function(r,o){if(!t.cellImgs[n])return!1;var s=t.cellImgs[n][o];if(!s)return!1;var h=g&&s.activeImg||s.defaultImg,c=t.computedWidthAndHeight(h,r,i),u=c[0],l=c[1];e.drawImage(h,a+t.getOffsetX(u,i.col),f+t.getHeight(r.top,i.row),u,l)})),i.fonts&&i.fonts.forEach((function(n){var o=g&&c.fontStyle?c.fontStyle:n.fontStyle||h.fontStyle,u=g&&c.fontWeight?c.fontWeight:n.fontWeight||h.fontWeight,l=g&&c.fontSize?t.getLength(c.fontSize):t.getLength(n.fontSize||h.fontSize),d=g&&c.lineHeight?c.lineHeight:n.lineHeight||h.lineHeight||n.fontSize||h.fontSize;e.font=u+" "+l*r+"px "+o,e.fillStyle=g&&c.fontColor?c.fontColor:n.fontColor||h.fontColor;var p=[],m=String(n.text);if(n.hasOwnProperty("wordWrap")?n.wordWrap:h.wordWrap){m=s(m);for(var v="",y=0;y<m.length;y++){v+=m[y],e.measureText(v).width>t.getWidth(n.lengthLimit||h.lengthLimit,i.col)&&(p.push(v.slice(0,-1)),v=m[y])}v&&p.push(v),p.length||p.push(m)}else p=m.split("\n");p.forEach((function(o,s){e.fillText(o,a+t.getOffsetX(e.measureText(o).width,i.col),f+t.getHeight(n.top,i.row)+(s+1)*t.getLength(d)*r)}))}))}))},r.prototype.handleBackground=function(t,i,e,n,r,o){void 0===o&&(o=!1);var s=this,a=s.ctx,h=s._defaultStyle,c=s._activeStyle;return(r=o?c.background:r||h.background).includes("linear-gradient")&&(r=function(t,i,e,n,r,o){var s=/linear-gradient\((.+)\)/.exec(o)[1].split(",").map((function(t){return t.trim()})),a=s.shift(),h=[0,0,0,0];if(a.includes("deg")){var c=function(t){return Math.tan(t/180*Math.PI)};(a=a.slice(0,-3)%360)>=0&&a<45?h=[i,e+r,i+n,e+r-n*c(a-0)]:a>=45&&a<90?h=[i,e+r,i+n-r*c(a-45),e]:a>=90&&a<135?h=[i+n,e+r,i+n-r*c(a-90),e]:a>=135&&a<180?h=[i+n,e+r,i,e+n*c(a-135)]:a>=180&&a<225?h=[i+n,e,i,e+n*c(a-180)]:a>=225&&a<270?h=[i+n,e,i+r*c(a-225),e+r]:a>=270&&a<315?h=[i,e,i+r*c(a-270),e+r]:a>=315&&a<360&&(h=[i,e,i+n,e+r-n*c(a-315)])}else a.includes("top")?h=[i,e+r,i,e]:a.includes("bottom")?h=[i,e,i,e+r]:a.includes("left")?h=[i+n,e,i,e]:a.includes("right")&&(h=[i,e,i+n,e]);var f=t.createLinearGradient.apply(t,h.map((function(t){return t>>0})));return s.reduce((function(t,i,e){var n=i.split(" ");return 1===n.length?t.addColorStop(e,n[0]):2===n.length&&t.addColorStop.apply(t,n),t}),f)}(a,t,i,e,n,r)),r},r.prototype.play=function(){this.startTime||(clearInterval(this.timer),cancelAnimationFrame(this.animationId),this.startTime=Date.now(),this.prizeFlag=void 0,this.run())},r.prototype.stop=function(t){this.prizeFlag=t%this.prizes.length},r.prototype.run=function(t){void 0===t&&(t=0);var i=this,e=i.currIndex,n=i.prizes,r=i.prizeFlag,o=i.startTime,s=i._defaultConfig,a=Date.now()-o;if(a>=s.accelerationTime&&void 0!==r){this.FPS=a/t,this.endTime=Date.now(),this.stopIndex=e;for(var h=0;++h;){var c=n.length*h+r-(e>>0);if(d(this.FPS,this.stopIndex,c,s.decelerationTime)-this.stopIndex>s.speed){this.endIndex=c;break}}return cancelAnimationFrame(this.animationId),this.slowDown()}this.currIndex=(e+l(a,.1,s.speed,s.accelerationTime))%n.length,this.draw(),this.animationId=window.requestAnimationFrame(this.run.bind(this,t+1))},r.prototype.slowDown=function(){var t,i=this,n=i.prizes,r=i.prizeFlag,o=i.stopIndex,s=i.endIndex,a=i._defaultConfig,h=Date.now()-this.endTime;if(h>a.decelerationTime)return this.startTime=0,null===(t=this.endCallback)||void 0===t||t.call(this,e({},n.find((function(t,i){return i===r})))),cancelAnimationFrame(this.animationId);this.currIndex=d(h,o,s,a.decelerationTime)%n.length,this.draw(),this.animationId=window.requestAnimationFrame(this.slowDown.bind(this))},r.prototype.walk=function(){var t=this;clearInterval(this.timer),this.timer=window.setInterval((function(){t.currIndex+=1,t.draw()}),1300)},r.prototype.getGeometricProperty=function(t){var i=t[0],e=t[1],n=t[2],r=t[3],o=this.cellWidth,s=this.cellHeight,a=this._defaultConfig.gutter,h=[this.prizeArea.x+(o+a)*i,this.prizeArea.y+(s+a)*e];return n&&r&&h.push(o*n+a*(n-1),s*r+a*(r-1)),h},r.prototype.getLength=function(t){return o(t,"number")?t:o(t,"string")?this.changeUnits(t,{clean:!0}):0},r.prototype.getWidth=function(t,i){return void 0===i&&(i=1),o(t,"number")?t*this.dpr:o(t,"string")?this.changeUnits(t,{denominator:this.cellWidth*i+this._defaultConfig.gutter*(i-1)}):0},r.prototype.getHeight=function(t,i){return void 0===i&&(i=1),o(t,"number")?t*this.dpr:o(t,"string")?this.changeUnits(t,{denominator:this.cellHeight*i+this._defaultConfig.gutter*(i-1)}):0},r.prototype.getOffsetX=function(t,i){return void 0===i&&(i=1),(this.cellWidth*i+this._defaultConfig.gutter*(i-1)-t)/2},r}(r);exports.LuckyGrid=p,exports.LuckyWheel=g;

dist/lucky-canvas.umd.min.js

@@ -1,1 +0,15 @@
-!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})}));
+!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";
+/*! *****************************************************************************
+    Copyright (c) Microsoft Corporation.
+
+    Permission to use, copy, modify, and/or distribute this software for any
+    purpose with or without fee is hereby granted.
+
+    THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+    REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+    AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+    INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+    LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+    OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+    PERFORMANCE OF THIS SOFTWARE.
+    ***************************************************************************** */var i=function(t,e){return(i=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,i){t.__proto__=i}||function(t,i){for(var e in i)Object.prototype.hasOwnProperty.call(i,e)&&(t[e]=i[e])})(t,e)};function e(t,e){function n(){this.constructor=t}i(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}var n=function(){return(n=Object.assign||function(t){for(var i,e=1,n=arguments.length;e<n;e++)for(var r in i=arguments[e])Object.prototype.hasOwnProperty.call(i,r)&&(t[r]=i[r]);return t}).apply(this,arguments)};function r(){for(var t=0,i=0,e=arguments.length;i<e;i++)t+=arguments[i].length;var n=Array(t),r=0;for(i=0;i<e;i++)for(var o=arguments[i],s=0,a=o.length;s<a;s++,r++)n[r]=o[s];return n}var o=function(){function t(t){this.htmlFontSize=16,this.dpr=1,this.subs={},this.setDpr(),this.setHTMLFontSize(),this.resetArrayPropo(),this.box="string"==typeof t?document.querySelector(t):t,this.canvas=document.createElement("canvas"),this.box.appendChild(this.canvas),this.ctx=this.canvas.getContext("2d")}return t.prototype.setDpr=function(){window.dpr=this.dpr=1.3*(window.devicePixelRatio||2)},t.prototype.setHTMLFontSize=function(){this.htmlFontSize=+getComputedStyle(document.documentElement).fontSize.slice(0,-2)},t.prototype.optimizeClarity=function(t,i,e){var n=this.dpr,r=function(t){return(t*n-t)/(t*n)*(n/2)*100};t.style.transform="scale("+1/n+") translate(\n      "+-r(i)+"%, "+-r(e)+"%\n    )"},t.prototype.changeUnits=function(t,i){var e=this,n=i.denominator,r=void 0===n?1:n,o=i.clean,s=void 0!==o&&o;return Number(t.replace(/^(\-*[0-9.]*)([a-z%]*)$/,(function(t,i,n){switch(n){case"%":i*=r/100;break;case"px":i*=1;break;case"rem":i*=e.htmlFontSize;break;default:i*=1}return s||"%"===n?i:i*e.dpr})))},t.prototype.draw=function(){},t.prototype.observer=function(t){var i=this;t&&"object"==typeof t&&Object.keys(t).forEach((function(e){i.defineReactive(t,e,t[e])}))},t.prototype.defineReactive=function(t,i,e){var n=this;this.observer(e),Object.defineProperty(t,i,{get:function(){return e},set:function(t){var r=e;t!==e&&(e=t,n.observer(e),n.subs[i]&&n.subs[i].call(n,e,r),n.draw())}})},t.prototype.$set=function(t,i,e){t&&"object"==typeof t&&this.defineReactive(t,i,e)},t.prototype.$computed=function(t,i,e){var n=this;Object.defineProperty(t,i,{get:function(){return e.call(n)}})},t.prototype.$watch=function(t,i){this.subs[t]=i},t.prototype.resetArrayPropo=function(){var t=this,i=Array.prototype,e=Object.create(i);["push","pop","shift","unshift","sort","splice","reverse"].forEach((function(n){e[n]=function(){var e;t.draw(),(e=i[n]).call.apply(e,r([this],Array.from(arguments)))}}))},t}(),s=function(t){for(var i=[],e=1;e<arguments.length;e++)i[e-1]=arguments[e];return i.some((function(i){return Object.prototype.toString.call(t).slice(8,-1).toLowerCase()===i}))},a=function(t){return[].filter.call(t,(function(t){return"\n"!==t})).join("")},h=function(t){return Math.PI/180*t},c=function(t,i){return[+(Math.cos(t)*i).toFixed(8),+(Math.sin(t)*i).toFixed(8)]},f=function(t,i){var e=-t/i;return[e,-e*t+i]},u=function(t,i,e,n,r){var o;if(void 0===r&&(r=!0),Math.abs(n-e).toFixed(8)>=h(180).toFixed(8)){var s=(n+e)/2;return r?(u(t,i,e,s,r),u(t,i,s,n,r)):(u(t,i,s,n,r),u(t,i,e,s,r)),!1}r||(e=(o=[n,e])[0],n=o[1]);var a=c(e,i),l=a[0],d=a[1],g=c(n,i),p=g[0],m=g[1],v=f(l,d),y=v[0],b=v[1],w=f(p,m),z=w[0],S=w[1],x=(S-b)/(y-z),I=(z*b-y*S)/(z-y);isNaN(x)&&(Math.abs(l)===+i.toFixed(8)&&(x=l),Math.abs(p)===+i.toFixed(8)&&(x=p)),y===1/0||y===-1/0?I=z*x+S:z!==1/0&&z!==-1/0||(I=y*x+b),t.lineTo(l,d),t.arcTo(x,I,p,m,i)},l=function(t,i,e,n,r,o,s){var a=Math.min(n,r);o>a/2&&(o=a/2),t.beginPath(),t.fillStyle=s,t.moveTo(i+o,e),t.lineTo(i+o,e),t.lineTo(i+n-o,e),t.arcTo(i+n,e,i+n,e+o,o),t.lineTo(i+n,e+r-o),t.arcTo(i+n,e+r,i+n-o,e+r,o),t.lineTo(i+o,e+r),t.arcTo(i,e+r,i,e+r-o,o),t.lineTo(i,e+o),t.arcTo(i,e,i+o,e,o),t.closePath(),t.fill()},d=function(t,i,e,n){return t>=n&&(t=n),e*(t/=n)*t+i},g=function(t,i,e,n){return t>=n&&(t=n),-e*(t/=n)*(t-2)+i},p=function(t){function i(i,e){void 0===e&&(e={});var n=t.call(this,i)||this;n.blocks=[],n.prizes=[],n.buttons=[],n.defaultConfig={},n._defaultConfig={gutter:"0px",offsetDegree:0,speed:20,accelerationTime:2500,decelerationTime:2500},n.defaultStyle={},n._defaultStyle={fontSize:"18px",fontColor:"#000",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",lineHeight:"",background:"#fff",wordWrap:!0,lengthLimit:"90%"},n.Radius=0,n.prizeRadius=0,n.prizeDeg=0,n.prizeRadian=0,n.rotateDeg=0,n.maxBtnRadius=0,n.startTime=0,n.endTime=0,n.stopDeg=0,n.endDeg=0,n.animationId=0,n.FPS=16.6,n.prizeImgs=[[]],n.btnImgs=[[]],n.initData(e),n.initComputed(),n.initWatch();var r=[[]];return n.prizes&&(r=n.prizes.map((function(t){return t.imgs}))),n.buttons&&r.push.apply(r,n.buttons.map((function(t){return t.imgs}))),n.init(r),n}return e(i,t),i.prototype.initData=function(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)},i.prototype.initComputed=function(){var t=this;this.$computed(this,"_defaultConfig",(function(){return n({gutter:"0px",offsetDegree:0,speed:20,accelerationTime:2500,decelerationTime:2500},t.defaultConfig)})),this.$computed(this,"_defaultStyle",(function(){return n({fontSize:"18px",fontColor:"#000",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",background:"#fff",wordWrap:!0,lengthLimit:"90%"},t.defaultStyle)}))},i.prototype.initWatch=function(){var t=this;this.$watch("prizes",(function(i,e){var n=[];return e?i&&i.forEach((function(i,r){var o=[],s=e[r];s?i.imgs&&i.imgs.forEach((function(i,e){if(!s.imgs)return o[e]=i;var n=s.imgs[e];n&&t.prizeImgs[r]&&t.prizeImgs[r][e]?i.src!==n.src&&(o[e]=i):o[e]=i})):o=i.imgs||[],n[r]=o})):n=i.map((function(t){return t.imgs})),t.init(n)})),this.$watch("buttons",(function(i,e){var n=[];return e?i&&i.forEach((function(i,r){var o=[],s=e[r];s&&s.imgs?i.imgs&&i.imgs.forEach((function(i,e){if(!s.imgs)return o[e]=i;var n=s.imgs[e];n&&t.btnImgs[r]&&t.btnImgs[r][e]?i.src!==n.src&&(o[e]=i):o[e]=i})):o=i.imgs||[],n[r]=o})):n=i.map((function(t){return t.imgs})),t.init(r(new Array(t.prizes.length).fill(void 0),n))}))},i.prototype.init=function(t){var i=this;this.setDpr(),this.setHTMLFontSize();var e=this,n=e.box,r=e.canvas,o=e.ctx,a=e.dpr;if(n){r.width=r.height=n.offsetWidth*a,this.Radius=r.width/2,this.optimizeClarity(r,2*this.Radius,2*this.Radius),o.translate(this.Radius,this.Radius);var h=function(){i.draw(),r.onclick=function(t){var e;o.beginPath(),o.arc(0,0,i.maxBtnRadius,0,2*Math.PI,!1),o.isPointInPath(t.offsetX,t.offsetY)&&(i.startTime||null===(e=i.startCallback)||void 0===e||e.call(i,t))}},c=0,f=0;s(t,"array")&&(this.draw(),t.forEach((function(t,e){if(!t)return!1;t.forEach((function(t,n){f++,i.loadAndCacheImg(e,n,(function(){c++,f===c&&h.call(i)}))}))}))),f||h.call(this)}},i.prototype.loadAndCacheImg=function(t,i,e){var n=this,r=t<this.prizes.length,o=r?"prizes":"buttons",s=r?"prizeImgs":"btnImgs";t=r?t:t-this.prizes.length;var a=this[o][t];if(a&&a.imgs){var h=a.imgs[i];if(h){var c=new Image;this[s][t]||(this[s][t]=[]),this[s][t][i]=c,c.src=h.src,c.onload=function(){return e.call(n)}}}},i.prototype.computedWidthAndHeight=function(t,i,e,n){if(!i.width&&!i.height)return[t.width,t.height];if(i.width&&!i.height){var r=this.getWidth(i.width,e);return[r,t.height*(r/t.width)]}if(!i.width&&i.height){var o=this.getHeight(i.height,n);return[t.width*(o/t.height),o]}return[this.getWidth(i.width,e),this.getHeight(i.height,n)]},i.prototype.draw=function(){var t=this,i=this,e=i.ctx,n=i.dpr,r=i._defaultConfig,o=i._defaultStyle;e.clearRect(-this.Radius,-this.Radius,2*this.Radius,2*this.Radius),this.prizeRadius=this.blocks.reduce((function(i,r){return e.beginPath(),e.fillStyle=r.background,e.arc(0,0,i,0,2*Math.PI,!1),e.fill(),i-t.getLength(r.padding.split(" ")[0])*n}),this.Radius),this.prizeDeg=360/this.prizes.length,this.prizeRadian=h(this.prizeDeg);var s=h(-90+this.rotateDeg+r.offsetDegree),f=function(i){return t.getOffsetX(e.measureText(i).width)},l=function(i,e,r){var s=i.lineHeight||o.lineHeight||i.fontSize||o.fontSize;return t.getHeight(i.top,e)+(r+1)*t.getLength(s)*n};e.save(),this.prizes.forEach((function(i,d){var g=s+d*t.prizeRadian,p=t.prizeRadius-t.maxBtnRadius;!function(t,i,e,n,r,o,s){i||(i=o);var a=h(90/Math.PI/e*o),f=h(90/Math.PI/i*o),l=n+a,d=r-a,g=n+f,p=r-f;t.beginPath(),t.fillStyle=s,t.moveTo.apply(t,c(l,e)),u(t,e,l,d,!0),p>g?u(t,i,g,p,!1):t.lineTo.apply(t,c((n+r)/2,o/2/Math.abs(Math.sin((n-r)/2)))),t.closePath(),t.fill()}(e,t.maxBtnRadius,t.prizeRadius,g-t.prizeRadian/2,g+t.prizeRadian/2,t.getLength(r.gutter)*n,i.background||o.background||"rgba(0, 0, 0, 0)");var m=Math.cos(g)*t.prizeRadius,v=Math.sin(g)*t.prizeRadius;e.translate(m,v),e.rotate(g+h(90)),i.imgs&&i.imgs.forEach((function(i,n){if(t.prizeImgs[d]){var r=t.prizeImgs[d][n];if(r){var o=t.computedWidthAndHeight(r,i,t.prizeRadian*t.prizeRadius,p),s=o[0],a=o[1];e.drawImage(r,t.getOffsetX(s),t.getHeight(i.top,p),s,a)}}})),i.fonts&&i.fonts.forEach((function(i){var s=i.fontColor||o.fontColor,h=i.fontWeight||o.fontWeight,c=t.getLength(i.fontSize||o.fontSize),u=i.fontStyle||o.fontStyle;e.fillStyle=s,e.font=h+" "+c*n+"px "+u;var d=[],g=String(i.text);if(i.hasOwnProperty("wordWrap")?i.wordWrap:o.wordWrap){g=a(g);for(var m="",v=0;v<g.length;v++){m+=g[v];var y=e.measureText(m).width,b=(t.prizeRadius-l(i,p,d.length))*Math.tan(t.prizeRadian/2)*2-t.getLength(r.gutter)*n;y>t.getWidth(i.lengthLimit||o.lengthLimit,b)&&(d.push(m.slice(0,-1)),m=g[v])}m&&d.push(m),d.length||d.push(g)}else d=g.split("\n");d.filter((function(t){return!!t})).forEach((function(t,n){e.fillText(t,f(t),l(i,p,n))}))})),e.rotate(h(360)-g-h(90)),e.translate(-m,-v)})),e.restore(),this.buttons.forEach((function(i,r){var s=t.getHeight(i.radius);t.maxBtnRadius=Math.max(t.maxBtnRadius,s),e.beginPath(),e.fillStyle=i.background||"rgba(0, 0, 0, 0)",e.arc(0,0,s,0,2*Math.PI,!1),e.fill(),i.pointer&&(e.beginPath(),e.fillStyle=i.background||"rgba(0, 0, 0, 0)",e.moveTo(-s,0),e.lineTo(s,0),e.lineTo(0,2*-s),e.closePath(),e.fill()),i.imgs&&i.imgs.forEach((function(n,o){if(t.btnImgs[r]){var a=t.btnImgs[r][o];if(a){var h=t.computedWidthAndHeight(a,n,2*t.getHeight(i.radius),2*t.getHeight(i.radius)),c=h[0],f=h[1];e.drawImage(a,t.getOffsetX(c),t.getHeight(n.top,s),c,f)}}})),i.fonts&&i.fonts.forEach((function(i){var r=i.fontColor||o.fontColor,a=i.fontWeight||o.fontWeight,h=t.getLength(i.fontSize||o.fontSize),c=i.fontStyle||o.fontStyle;e.fillStyle=r,e.font=a+" "+h*n+"px "+c,String(i.text).split("\n").forEach((function(t,n){e.fillText(t,f(t),l(i,s,n))}))}))}))},i.prototype.play=function(){this.startTime||(cancelAnimationFrame(this.animationId),this.startTime=Date.now(),this.prizeFlag=void 0,this.run())},i.prototype.stop=function(t){this.prizeFlag=Number(t)%this.prizes.length},i.prototype.run=function(t){void 0===t&&(t=0);var i=this,e=i.prizeFlag,n=i.prizeDeg,r=i.rotateDeg,o=i._defaultConfig,s=Date.now()-this.startTime;if(s>=o.accelerationTime&&void 0!==e){this.FPS=s/t,this.endTime=Date.now(),this.stopDeg=r;for(var a=0;++a;){var h=360*a-e*n-r-o.offsetDegree;if(g(this.FPS,this.stopDeg,h,o.decelerationTime)-this.stopDeg>o.speed){this.endDeg=h;break}}return cancelAnimationFrame(this.animationId),this.slowDown()}this.rotateDeg=(r+d(s,0,o.speed,o.accelerationTime))%360,this.draw(),this.animationId=window.requestAnimationFrame(this.run.bind(this,t+1))},i.prototype.slowDown=function(){var t,i=this,e=i.prizes,r=i.prizeFlag,o=i.stopDeg,s=i.endDeg,a=i._defaultConfig,h=Date.now()-this.endTime;if(h>=a.decelerationTime)return this.startTime=0,null===(t=this.endCallback)||void 0===t||t.call(this,n({},e.find((function(t,i){return i===r})))),cancelAnimationFrame(this.animationId);this.rotateDeg=g(h,o,s,a.decelerationTime)%360,this.draw(),this.animationId=window.requestAnimationFrame(this.slowDown.bind(this))},i.prototype.getLength=function(t){return s(t,"number")?t:s(t,"string")?this.changeUnits(t,{clean:!0}):0},i.prototype.getWidth=function(t,i){return void 0===i&&(i=this.prizeRadian*this.prizeRadius),s(t,"number")?t*this.dpr:s(t,"string")?this.changeUnits(t,{denominator:i}):0},i.prototype.getHeight=function(t,i){return void 0===i&&(i=this.prizeRadius),s(t,"number")?t*this.dpr:s(t,"string")?this.changeUnits(t,{denominator:i}):0},i.prototype.getOffsetX=function(t){return-t/2},i}(o),m=function(t){function i(i,e){void 0===e&&(e={});var n=t.call(this,i)||this;n.rows=3,n.cols=3,n.blocks=[],n.prizes=[],n.defaultConfig={},n._defaultConfig={gutter:5,speed:20,accelerationTime:2500,decelerationTime:2500},n.defaultStyle={},n._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%"},n.activeStyle={},n._activeStyle={background:"#ffce98",shadow:"",fontStyle:"",fontWeight:"",fontSize:"",lineHeight:"",fontColor:""},n.boxWidth=0,n.boxHeight=0,n.cellWidth=0,n.cellHeight=0,n.startTime=0,n.endTime=0,n.currIndex=0,n.stopIndex=0,n.endIndex=0,n.demo=!1,n.timer=0,n.animationId=0,n.FPS=16.6,n.cells=[],n.cellImgs=[],n.initData(e),n.initComputed(),n.initWatch();var r=[[]];return n.prizes&&(r=n.prizes.map((function(t){return t.imgs}))),n.button&&(r[n.cols*n.rows-1]=n.button.imgs),n.init(r),n}return e(i,t),i.prototype.initData=function(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)},i.prototype.initComputed=function(){var t=this;this.$computed(this,"_defaultConfig",(function(){var i=n({gutter:5,speed:20,accelerationTime:2500,decelerationTime:2500},t.defaultConfig);return i.gutter=t.getLength(i.gutter)*t.dpr,i.speed=i.speed/40,i})),this.$computed(this,"_defaultStyle",(function(){return n({borderRadius:20,fontColor:"#000",fontSize:"18px",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",background:"#fff",shadow:"",wordWrap:!0,lengthLimit:"90%"},t.defaultStyle)})),this.$computed(this,"_activeStyle",(function(){return n({background:"#ffce98",shadow:""},t.activeStyle)}))},i.prototype.initWatch=function(){var t=this;this.$watch("prizes",(function(i,e){var n=[];return e?i&&i.forEach((function(i,r){var o=[],s=e[r];s?i.imgs&&i.imgs.forEach((function(i,e){if(!s.imgs)return o[e]=i;var n=s.imgs[e];n&&t.cellImgs[r][e]?i.src!==n.src&&(o[e]=i):o[e]=i})):o=i.imgs||[],n[r]=o})):n=i.map((function(t){return t.imgs})),t.init(n)})),this.$watch("button",(function(i,e){var n=[],r=t.cols*t.rows-1;if(e&&e.imgs){if(i.imgs){var o=[];i.imgs.forEach((function(i,n){if(!e.imgs)return o[n]=i;var s=e.imgs[n];s&&t.cellImgs[r][n]?i.src!==s.src&&(o[n]=i):o[n]=i})),n[r]=o}}else n[r]=i.imgs;return t.init(n)}))},i.prototype.init=function(t){var i=this;this.setDpr(),this.setHTMLFontSize();var e=this,n=e.box,r=e.canvas,o=e.dpr;if(n){this.boxWidth=r.width=n.offsetWidth*o,this.boxHeight=r.height=n.offsetHeight*o,this.optimizeClarity(r,this.boxWidth,this.boxHeight);var a=function(){i.draw(),i.demo&&i.walk(),i.button&&(r.onclick=function(t){var e,n=i.getGeometricProperty([i.button.x,i.button.y,i.button.col||1,i.button.row||1]),r=n[0],o=n[1],s=n[2],a=n[3];if(t.offsetX<r||t.offsetY<o||t.offsetX>r+s||t.offsetY>o+a)return!1;i.startTime||null===(e=i.startCallback)||void 0===e||e.call(i,t)})},h=0,c=0;s(t,"array")&&(this.draw(),t.forEach((function(t,e){if(!t)return!1;t.forEach((function(t,n){c++,i.loadAndCacheImg(e,n,(function(){h++,c===h&&a.call(i)}))}))}))),c||a.call(this)}},i.prototype.loadAndCacheImg=function(t,i,e){var n=this,r=this.cells[t];if(r&&r.imgs){var o=r.imgs[i];this.cellImgs[t]||(this.cellImgs[t]=[]);var s=new Image;this.cellImgs[t][i]={defaultImg:s},s.src=o.src;var a=0,h=1;if(s.onload=function(){++a===h&&e.call(n)},o.hasOwnProperty("activeSrc")){h++;var c=new Image;this.cellImgs[t][i].activeImg=c,c.src=o.activeSrc,c.onload=function(){++a===h&&e.call(n)}}}},i.prototype.computedWidthAndHeight=function(t,i,e){if(!i.width&&!i.height)return[t.width,t.height];if(i.width&&!i.height){var n=this.getWidth(i.width,e.col);return[n,t.height*(n/t.width)]}if(!i.width&&i.height){var r=this.getHeight(i.height,e.row);return[t.width*(r/t.height),r]}return[this.getWidth(i.width,e.col),this.getHeight(i.height,e.row)]},i.prototype.draw=function(){var t=this,i=this,e=i.ctx,n=i.dpr,o=i._defaultConfig,h=i._defaultStyle,c=i._activeStyle;e.clearRect(0,0,this.boxWidth,this.boxWidth),this.cells=r(this.prizes),this.button&&(this.cells[this.cols*this.rows-1]=this.button),this.cells.forEach((function(t){t.col=t.col||1,t.row=t.row||1})),this.prizeArea=this.blocks.reduce((function(i,r){var o=i.x,a=i.y,h=i.w,c=i.h,f=function(t){var i=t.padding.replace(/px/g,"").split(" ").map((function(t){return~~t}))||[0],e=0,n=0,r=0,o=0;switch(i.length){case 1:e=n=r=o=i[0];break;case 2:e=n=i[0],r=o=i[1];break;case 3:e=i[0],r=o=i[1],n=i[2];break;default:e=i[0],n=i[1],r=i[2],o=i[3]}var a={paddingTop:e,paddingBottom:n,paddingLeft:r,paddingRight:o};for(var h in a)a[h]=t.hasOwnProperty(h)&&s(t[h],"string","number")?~~String(t[h]).replace(/px/g,""):a[h];return[e,n,r,o]}(r).map((function(t){return t*n})),u=f[0],d=f[1],g=f[2],p=f[3],m=r.borderRadius?t.getLength(r.borderRadius)*n:0;return l(e,o,a,h,c,m,t.handleBackground(o,a,h,c,r.background)),{x:o+g,y:a+u,w:h-g-p,h:c-u-d}}),{x:0,y:0,w:this.boxWidth,h:this.boxHeight}),this.cellWidth=(this.prizeArea.w-o.gutter*(this.cols-1))/this.cols,this.cellHeight=(this.prizeArea.h-o.gutter*(this.rows-1))/this.rows,this.cells.forEach((function(i,r){var o=t.getGeometricProperty([i.x,i.y,i.col,i.row]),s=o[0],f=o[1],u=o[2],d=o[3],g=r===t.currIndex%t.prizes.length>>0,p=(g?c.shadow:i.shadow||h.shadow).replace(/px/g,"").split(",")[0].split(" ").map((function(t,i){return i<3?Number(t)*n:t}));4===p.length&&(e.shadowColor=p[3],e.shadowOffsetX=p[0],e.shadowOffsetY=p[1],e.shadowBlur=p[2],p[0]>0?u-=p[0]:(u+=p[0],s-=p[0]),p[1]>0?d-=p[1]:(d+=p[1],f-=p[1])),l(e,s,f,u,d,t.getLength(i.borderRadius?i.borderRadius:h.borderRadius)*n,t.handleBackground(s,f,u,d,i.background,g)),e.shadowColor="rgba(255, 255, 255, 0)",e.shadowOffsetX=0,e.shadowOffsetY=0,e.shadowBlur=0,i.imgs&&i.imgs.forEach((function(n,o){if(!t.cellImgs[r])return!1;var a=t.cellImgs[r][o];if(!a)return!1;var h=g&&a.activeImg||a.defaultImg,c=t.computedWidthAndHeight(h,n,i),u=c[0],l=c[1];e.drawImage(h,s+t.getOffsetX(u,i.col),f+t.getHeight(n.top,i.row),u,l)})),i.fonts&&i.fonts.forEach((function(r){var o=g&&c.fontStyle?c.fontStyle:r.fontStyle||h.fontStyle,u=g&&c.fontWeight?c.fontWeight:r.fontWeight||h.fontWeight,l=g&&c.fontSize?t.getLength(c.fontSize):t.getLength(r.fontSize||h.fontSize),d=g&&c.lineHeight?c.lineHeight:r.lineHeight||h.lineHeight||r.fontSize||h.fontSize;e.font=u+" "+l*n+"px "+o,e.fillStyle=g&&c.fontColor?c.fontColor:r.fontColor||h.fontColor;var p=[],m=String(r.text);if(r.hasOwnProperty("wordWrap")?r.wordWrap:h.wordWrap){m=a(m);for(var v="",y=0;y<m.length;y++){v+=m[y],e.measureText(v).width>t.getWidth(r.lengthLimit||h.lengthLimit,i.col)&&(p.push(v.slice(0,-1)),v=m[y])}v&&p.push(v),p.length||p.push(m)}else p=m.split("\n");p.forEach((function(o,a){e.fillText(o,s+t.getOffsetX(e.measureText(o).width,i.col),f+t.getHeight(r.top,i.row)+(a+1)*t.getLength(d)*n)}))}))}))},i.prototype.handleBackground=function(t,i,e,n,r,o){void 0===o&&(o=!1);var s=this,a=s.ctx,h=s._defaultStyle,c=s._activeStyle;return(r=o?c.background:r||h.background).includes("linear-gradient")&&(r=function(t,i,e,n,r,o){var s=/linear-gradient\((.+)\)/.exec(o)[1].split(",").map((function(t){return t.trim()})),a=s.shift(),h=[0,0,0,0];if(a.includes("deg")){var c=function(t){return Math.tan(t/180*Math.PI)};(a=a.slice(0,-3)%360)>=0&&a<45?h=[i,e+r,i+n,e+r-n*c(a-0)]:a>=45&&a<90?h=[i,e+r,i+n-r*c(a-45),e]:a>=90&&a<135?h=[i+n,e+r,i+n-r*c(a-90),e]:a>=135&&a<180?h=[i+n,e+r,i,e+n*c(a-135)]:a>=180&&a<225?h=[i+n,e,i,e+n*c(a-180)]:a>=225&&a<270?h=[i+n,e,i+r*c(a-225),e+r]:a>=270&&a<315?h=[i,e,i+r*c(a-270),e+r]:a>=315&&a<360&&(h=[i,e,i+n,e+r-n*c(a-315)])}else a.includes("top")?h=[i,e+r,i,e]:a.includes("bottom")?h=[i,e,i,e+r]:a.includes("left")?h=[i+n,e,i,e]:a.includes("right")&&(h=[i,e,i+n,e]);var f=t.createLinearGradient.apply(t,h.map((function(t){return t>>0})));return s.reduce((function(t,i,e){var n=i.split(" ");return 1===n.length?t.addColorStop(e,n[0]):2===n.length&&t.addColorStop.apply(t,n),t}),f)}(a,t,i,e,n,r)),r},i.prototype.play=function(){this.startTime||(clearInterval(this.timer),cancelAnimationFrame(this.animationId),this.startTime=Date.now(),this.prizeFlag=void 0,this.run())},i.prototype.stop=function(t){this.prizeFlag=t%this.prizes.length},i.prototype.run=function(t){void 0===t&&(t=0);var i=this,e=i.currIndex,n=i.prizes,r=i.prizeFlag,o=i.startTime,s=i._defaultConfig,a=Date.now()-o;if(a>=s.accelerationTime&&void 0!==r){this.FPS=a/t,this.endTime=Date.now(),this.stopIndex=e;for(var h=0;++h;){var c=n.length*h+r-(e>>0);if(g(this.FPS,this.stopIndex,c,s.decelerationTime)-this.stopIndex>s.speed){this.endIndex=c;break}}return cancelAnimationFrame(this.animationId),this.slowDown()}this.currIndex=(e+d(a,.1,s.speed,s.accelerationTime))%n.length,this.draw(),this.animationId=window.requestAnimationFrame(this.run.bind(this,t+1))},i.prototype.slowDown=function(){var t,i=this,e=i.prizes,r=i.prizeFlag,o=i.stopIndex,s=i.endIndex,a=i._defaultConfig,h=Date.now()-this.endTime;if(h>a.decelerationTime)return this.startTime=0,null===(t=this.endCallback)||void 0===t||t.call(this,n({},e.find((function(t,i){return i===r})))),cancelAnimationFrame(this.animationId);this.currIndex=g(h,o,s,a.decelerationTime)%e.length,this.draw(),this.animationId=window.requestAnimationFrame(this.slowDown.bind(this))},i.prototype.walk=function(){var t=this;clearInterval(this.timer),this.timer=window.setInterval((function(){t.currIndex+=1,t.draw()}),1300)},i.prototype.getGeometricProperty=function(t){var i=t[0],e=t[1],n=t[2],r=t[3],o=this.cellWidth,s=this.cellHeight,a=this._defaultConfig.gutter,h=[this.prizeArea.x+(o+a)*i,this.prizeArea.y+(s+a)*e];return n&&r&&h.push(o*n+a*(n-1),s*r+a*(r-1)),h},i.prototype.getLength=function(t){return s(t,"number")?t:s(t,"string")?this.changeUnits(t,{clean:!0}):0},i.prototype.getWidth=function(t,i){return void 0===i&&(i=1),s(t,"number")?t*this.dpr:s(t,"string")?this.changeUnits(t,{denominator:this.cellWidth*i+this._defaultConfig.gutter*(i-1)}):0},i.prototype.getHeight=function(t,i){return void 0===i&&(i=1),s(t,"number")?t*this.dpr:s(t,"string")?this.changeUnits(t,{denominator:this.cellHeight*i+this._defaultConfig.gutter*(i-1)}):0},i.prototype.getOffsetX=function(t,i){return void 0===i&&(i=1),(this.cellWidth*i+this._defaultConfig.gutter*(i-1)-t)/2},i}(o);t.LuckyGrid=m,t.LuckyWheel=p,Object.defineProperty(t,"__esModule",{value:!0})}));

package.json

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

umd.min.js

@@ -1,1 +0,15 @@
-!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})}));
+!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";
+/*! *****************************************************************************
+    Copyright (c) Microsoft Corporation.
+
+    Permission to use, copy, modify, and/or distribute this software for any
+    purpose with or without fee is hereby granted.
+
+    THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+    REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+    AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+    INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+    LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+    OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+    PERFORMANCE OF THIS SOFTWARE.
+    ***************************************************************************** */var i=function(t,e){return(i=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,i){t.__proto__=i}||function(t,i){for(var e in i)Object.prototype.hasOwnProperty.call(i,e)&&(t[e]=i[e])})(t,e)};function e(t,e){function n(){this.constructor=t}i(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}var n=function(){return(n=Object.assign||function(t){for(var i,e=1,n=arguments.length;e<n;e++)for(var r in i=arguments[e])Object.prototype.hasOwnProperty.call(i,r)&&(t[r]=i[r]);return t}).apply(this,arguments)};function r(){for(var t=0,i=0,e=arguments.length;i<e;i++)t+=arguments[i].length;var n=Array(t),r=0;for(i=0;i<e;i++)for(var o=arguments[i],s=0,a=o.length;s<a;s++,r++)n[r]=o[s];return n}var o=function(){function t(t){this.htmlFontSize=16,this.dpr=1,this.subs={},this.setDpr(),this.setHTMLFontSize(),this.resetArrayPropo(),this.box="string"==typeof t?document.querySelector(t):t,this.canvas=document.createElement("canvas"),this.box.appendChild(this.canvas),this.ctx=this.canvas.getContext("2d")}return t.prototype.setDpr=function(){window.dpr=this.dpr=1.3*(window.devicePixelRatio||2)},t.prototype.setHTMLFontSize=function(){this.htmlFontSize=+getComputedStyle(document.documentElement).fontSize.slice(0,-2)},t.prototype.optimizeClarity=function(t,i,e){var n=this.dpr,r=function(t){return(t*n-t)/(t*n)*(n/2)*100};t.style.transform="scale("+1/n+") translate(\n      "+-r(i)+"%, "+-r(e)+"%\n    )"},t.prototype.changeUnits=function(t,i){var e=this,n=i.denominator,r=void 0===n?1:n,o=i.clean,s=void 0!==o&&o;return Number(t.replace(/^(\-*[0-9.]*)([a-z%]*)$/,(function(t,i,n){switch(n){case"%":i*=r/100;break;case"px":i*=1;break;case"rem":i*=e.htmlFontSize;break;default:i*=1}return s||"%"===n?i:i*e.dpr})))},t.prototype.draw=function(){},t.prototype.observer=function(t){var i=this;t&&"object"==typeof t&&Object.keys(t).forEach((function(e){i.defineReactive(t,e,t[e])}))},t.prototype.defineReactive=function(t,i,e){var n=this;this.observer(e),Object.defineProperty(t,i,{get:function(){return e},set:function(t){var r=e;t!==e&&(e=t,n.observer(e),n.subs[i]&&n.subs[i].call(n,e,r),n.draw())}})},t.prototype.$set=function(t,i,e){t&&"object"==typeof t&&this.defineReactive(t,i,e)},t.prototype.$computed=function(t,i,e){var n=this;Object.defineProperty(t,i,{get:function(){return e.call(n)}})},t.prototype.$watch=function(t,i){this.subs[t]=i},t.prototype.resetArrayPropo=function(){var t=this,i=Array.prototype,e=Object.create(i);["push","pop","shift","unshift","sort","splice","reverse"].forEach((function(n){e[n]=function(){var e;t.draw(),(e=i[n]).call.apply(e,r([this],Array.from(arguments)))}}))},t}(),s=function(t){for(var i=[],e=1;e<arguments.length;e++)i[e-1]=arguments[e];return i.some((function(i){return Object.prototype.toString.call(t).slice(8,-1).toLowerCase()===i}))},a=function(t){return[].filter.call(t,(function(t){return"\n"!==t})).join("")},h=function(t){return Math.PI/180*t},c=function(t,i){return[+(Math.cos(t)*i).toFixed(8),+(Math.sin(t)*i).toFixed(8)]},f=function(t,i){var e=-t/i;return[e,-e*t+i]},u=function(t,i,e,n,r){var o;if(void 0===r&&(r=!0),Math.abs(n-e).toFixed(8)>=h(180).toFixed(8)){var s=(n+e)/2;return r?(u(t,i,e,s,r),u(t,i,s,n,r)):(u(t,i,s,n,r),u(t,i,e,s,r)),!1}r||(e=(o=[n,e])[0],n=o[1]);var a=c(e,i),l=a[0],d=a[1],g=c(n,i),p=g[0],m=g[1],v=f(l,d),y=v[0],b=v[1],w=f(p,m),z=w[0],S=w[1],x=(S-b)/(y-z),I=(z*b-y*S)/(z-y);isNaN(x)&&(Math.abs(l)===+i.toFixed(8)&&(x=l),Math.abs(p)===+i.toFixed(8)&&(x=p)),y===1/0||y===-1/0?I=z*x+S:z!==1/0&&z!==-1/0||(I=y*x+b),t.lineTo(l,d),t.arcTo(x,I,p,m,i)},l=function(t,i,e,n,r,o,s){var a=Math.min(n,r);o>a/2&&(o=a/2),t.beginPath(),t.fillStyle=s,t.moveTo(i+o,e),t.lineTo(i+o,e),t.lineTo(i+n-o,e),t.arcTo(i+n,e,i+n,e+o,o),t.lineTo(i+n,e+r-o),t.arcTo(i+n,e+r,i+n-o,e+r,o),t.lineTo(i+o,e+r),t.arcTo(i,e+r,i,e+r-o,o),t.lineTo(i,e+o),t.arcTo(i,e,i+o,e,o),t.closePath(),t.fill()},d=function(t,i,e,n){return t>=n&&(t=n),e*(t/=n)*t+i},g=function(t,i,e,n){return t>=n&&(t=n),-e*(t/=n)*(t-2)+i},p=function(t){function i(i,e){void 0===e&&(e={});var n=t.call(this,i)||this;n.blocks=[],n.prizes=[],n.buttons=[],n.defaultConfig={},n._defaultConfig={gutter:"0px",offsetDegree:0,speed:20,accelerationTime:2500,decelerationTime:2500},n.defaultStyle={},n._defaultStyle={fontSize:"18px",fontColor:"#000",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",lineHeight:"",background:"#fff",wordWrap:!0,lengthLimit:"90%"},n.Radius=0,n.prizeRadius=0,n.prizeDeg=0,n.prizeRadian=0,n.rotateDeg=0,n.maxBtnRadius=0,n.startTime=0,n.endTime=0,n.stopDeg=0,n.endDeg=0,n.animationId=0,n.FPS=16.6,n.prizeImgs=[[]],n.btnImgs=[[]],n.initData(e),n.initComputed(),n.initWatch();var r=[[]];return n.prizes&&(r=n.prizes.map((function(t){return t.imgs}))),n.buttons&&r.push.apply(r,n.buttons.map((function(t){return t.imgs}))),n.init(r),n}return e(i,t),i.prototype.initData=function(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)},i.prototype.initComputed=function(){var t=this;this.$computed(this,"_defaultConfig",(function(){return n({gutter:"0px",offsetDegree:0,speed:20,accelerationTime:2500,decelerationTime:2500},t.defaultConfig)})),this.$computed(this,"_defaultStyle",(function(){return n({fontSize:"18px",fontColor:"#000",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",background:"#fff",wordWrap:!0,lengthLimit:"90%"},t.defaultStyle)}))},i.prototype.initWatch=function(){var t=this;this.$watch("prizes",(function(i,e){var n=[];return e?i&&i.forEach((function(i,r){var o=[],s=e[r];s?i.imgs&&i.imgs.forEach((function(i,e){if(!s.imgs)return o[e]=i;var n=s.imgs[e];n&&t.prizeImgs[r]&&t.prizeImgs[r][e]?i.src!==n.src&&(o[e]=i):o[e]=i})):o=i.imgs||[],n[r]=o})):n=i.map((function(t){return t.imgs})),t.init(n)})),this.$watch("buttons",(function(i,e){var n=[];return e?i&&i.forEach((function(i,r){var o=[],s=e[r];s&&s.imgs?i.imgs&&i.imgs.forEach((function(i,e){if(!s.imgs)return o[e]=i;var n=s.imgs[e];n&&t.btnImgs[r]&&t.btnImgs[r][e]?i.src!==n.src&&(o[e]=i):o[e]=i})):o=i.imgs||[],n[r]=o})):n=i.map((function(t){return t.imgs})),t.init(r(new Array(t.prizes.length).fill(void 0),n))}))},i.prototype.init=function(t){var i=this;this.setDpr(),this.setHTMLFontSize();var e=this,n=e.box,r=e.canvas,o=e.ctx,a=e.dpr;if(n){r.width=r.height=n.offsetWidth*a,this.Radius=r.width/2,this.optimizeClarity(r,2*this.Radius,2*this.Radius),o.translate(this.Radius,this.Radius);var h=function(){i.draw(),r.onclick=function(t){var e;o.beginPath(),o.arc(0,0,i.maxBtnRadius,0,2*Math.PI,!1),o.isPointInPath(t.offsetX,t.offsetY)&&(i.startTime||null===(e=i.startCallback)||void 0===e||e.call(i,t))}},c=0,f=0;s(t,"array")&&(this.draw(),t.forEach((function(t,e){if(!t)return!1;t.forEach((function(t,n){f++,i.loadAndCacheImg(e,n,(function(){c++,f===c&&h.call(i)}))}))}))),f||h.call(this)}},i.prototype.loadAndCacheImg=function(t,i,e){var n=this,r=t<this.prizes.length,o=r?"prizes":"buttons",s=r?"prizeImgs":"btnImgs";t=r?t:t-this.prizes.length;var a=this[o][t];if(a&&a.imgs){var h=a.imgs[i];if(h){var c=new Image;this[s][t]||(this[s][t]=[]),this[s][t][i]=c,c.src=h.src,c.onload=function(){return e.call(n)}}}},i.prototype.computedWidthAndHeight=function(t,i,e,n){if(!i.width&&!i.height)return[t.width,t.height];if(i.width&&!i.height){var r=this.getWidth(i.width,e);return[r,t.height*(r/t.width)]}if(!i.width&&i.height){var o=this.getHeight(i.height,n);return[t.width*(o/t.height),o]}return[this.getWidth(i.width,e),this.getHeight(i.height,n)]},i.prototype.draw=function(){var t=this,i=this,e=i.ctx,n=i.dpr,r=i._defaultConfig,o=i._defaultStyle;e.clearRect(-this.Radius,-this.Radius,2*this.Radius,2*this.Radius),this.prizeRadius=this.blocks.reduce((function(i,r){return e.beginPath(),e.fillStyle=r.background,e.arc(0,0,i,0,2*Math.PI,!1),e.fill(),i-t.getLength(r.padding.split(" ")[0])*n}),this.Radius),this.prizeDeg=360/this.prizes.length,this.prizeRadian=h(this.prizeDeg);var s=h(-90+this.rotateDeg+r.offsetDegree),f=function(i){return t.getOffsetX(e.measureText(i).width)},l=function(i,e,r){var s=i.lineHeight||o.lineHeight||i.fontSize||o.fontSize;return t.getHeight(i.top,e)+(r+1)*t.getLength(s)*n};e.save(),this.prizes.forEach((function(i,d){var g=s+d*t.prizeRadian,p=t.prizeRadius-t.maxBtnRadius;!function(t,i,e,n,r,o,s){i||(i=o);var a=h(90/Math.PI/e*o),f=h(90/Math.PI/i*o),l=n+a,d=r-a,g=n+f,p=r-f;t.beginPath(),t.fillStyle=s,t.moveTo.apply(t,c(l,e)),u(t,e,l,d,!0),p>g?u(t,i,g,p,!1):t.lineTo.apply(t,c((n+r)/2,o/2/Math.abs(Math.sin((n-r)/2)))),t.closePath(),t.fill()}(e,t.maxBtnRadius,t.prizeRadius,g-t.prizeRadian/2,g+t.prizeRadian/2,t.getLength(r.gutter)*n,i.background||o.background||"rgba(0, 0, 0, 0)");var m=Math.cos(g)*t.prizeRadius,v=Math.sin(g)*t.prizeRadius;e.translate(m,v),e.rotate(g+h(90)),i.imgs&&i.imgs.forEach((function(i,n){if(t.prizeImgs[d]){var r=t.prizeImgs[d][n];if(r){var o=t.computedWidthAndHeight(r,i,t.prizeRadian*t.prizeRadius,p),s=o[0],a=o[1];e.drawImage(r,t.getOffsetX(s),t.getHeight(i.top,p),s,a)}}})),i.fonts&&i.fonts.forEach((function(i){var s=i.fontColor||o.fontColor,h=i.fontWeight||o.fontWeight,c=t.getLength(i.fontSize||o.fontSize),u=i.fontStyle||o.fontStyle;e.fillStyle=s,e.font=h+" "+c*n+"px "+u;var d=[],g=String(i.text);if(i.hasOwnProperty("wordWrap")?i.wordWrap:o.wordWrap){g=a(g);for(var m="",v=0;v<g.length;v++){m+=g[v];var y=e.measureText(m).width,b=(t.prizeRadius-l(i,p,d.length))*Math.tan(t.prizeRadian/2)*2-t.getLength(r.gutter)*n;y>t.getWidth(i.lengthLimit||o.lengthLimit,b)&&(d.push(m.slice(0,-1)),m=g[v])}m&&d.push(m),d.length||d.push(g)}else d=g.split("\n");d.filter((function(t){return!!t})).forEach((function(t,n){e.fillText(t,f(t),l(i,p,n))}))})),e.rotate(h(360)-g-h(90)),e.translate(-m,-v)})),e.restore(),this.buttons.forEach((function(i,r){var s=t.getHeight(i.radius);t.maxBtnRadius=Math.max(t.maxBtnRadius,s),e.beginPath(),e.fillStyle=i.background||"rgba(0, 0, 0, 0)",e.arc(0,0,s,0,2*Math.PI,!1),e.fill(),i.pointer&&(e.beginPath(),e.fillStyle=i.background||"rgba(0, 0, 0, 0)",e.moveTo(-s,0),e.lineTo(s,0),e.lineTo(0,2*-s),e.closePath(),e.fill()),i.imgs&&i.imgs.forEach((function(n,o){if(t.btnImgs[r]){var a=t.btnImgs[r][o];if(a){var h=t.computedWidthAndHeight(a,n,2*t.getHeight(i.radius),2*t.getHeight(i.radius)),c=h[0],f=h[1];e.drawImage(a,t.getOffsetX(c),t.getHeight(n.top,s),c,f)}}})),i.fonts&&i.fonts.forEach((function(i){var r=i.fontColor||o.fontColor,a=i.fontWeight||o.fontWeight,h=t.getLength(i.fontSize||o.fontSize),c=i.fontStyle||o.fontStyle;e.fillStyle=r,e.font=a+" "+h*n+"px "+c,String(i.text).split("\n").forEach((function(t,n){e.fillText(t,f(t),l(i,s,n))}))}))}))},i.prototype.play=function(){this.startTime||(cancelAnimationFrame(this.animationId),this.startTime=Date.now(),this.prizeFlag=void 0,this.run())},i.prototype.stop=function(t){this.prizeFlag=Number(t)%this.prizes.length},i.prototype.run=function(t){void 0===t&&(t=0);var i=this,e=i.prizeFlag,n=i.prizeDeg,r=i.rotateDeg,o=i._defaultConfig,s=Date.now()-this.startTime;if(s>=o.accelerationTime&&void 0!==e){this.FPS=s/t,this.endTime=Date.now(),this.stopDeg=r;for(var a=0;++a;){var h=360*a-e*n-r-o.offsetDegree;if(g(this.FPS,this.stopDeg,h,o.decelerationTime)-this.stopDeg>o.speed){this.endDeg=h;break}}return cancelAnimationFrame(this.animationId),this.slowDown()}this.rotateDeg=(r+d(s,0,o.speed,o.accelerationTime))%360,this.draw(),this.animationId=window.requestAnimationFrame(this.run.bind(this,t+1))},i.prototype.slowDown=function(){var t,i=this,e=i.prizes,r=i.prizeFlag,o=i.stopDeg,s=i.endDeg,a=i._defaultConfig,h=Date.now()-this.endTime;if(h>=a.decelerationTime)return this.startTime=0,null===(t=this.endCallback)||void 0===t||t.call(this,n({},e.find((function(t,i){return i===r})))),cancelAnimationFrame(this.animationId);this.rotateDeg=g(h,o,s,a.decelerationTime)%360,this.draw(),this.animationId=window.requestAnimationFrame(this.slowDown.bind(this))},i.prototype.getLength=function(t){return s(t,"number")?t:s(t,"string")?this.changeUnits(t,{clean:!0}):0},i.prototype.getWidth=function(t,i){return void 0===i&&(i=this.prizeRadian*this.prizeRadius),s(t,"number")?t*this.dpr:s(t,"string")?this.changeUnits(t,{denominator:i}):0},i.prototype.getHeight=function(t,i){return void 0===i&&(i=this.prizeRadius),s(t,"number")?t*this.dpr:s(t,"string")?this.changeUnits(t,{denominator:i}):0},i.prototype.getOffsetX=function(t){return-t/2},i}(o),m=function(t){function i(i,e){void 0===e&&(e={});var n=t.call(this,i)||this;n.rows=3,n.cols=3,n.blocks=[],n.prizes=[],n.defaultConfig={},n._defaultConfig={gutter:5,speed:20,accelerationTime:2500,decelerationTime:2500},n.defaultStyle={},n._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%"},n.activeStyle={},n._activeStyle={background:"#ffce98",shadow:"",fontStyle:"",fontWeight:"",fontSize:"",lineHeight:"",fontColor:""},n.boxWidth=0,n.boxHeight=0,n.cellWidth=0,n.cellHeight=0,n.startTime=0,n.endTime=0,n.currIndex=0,n.stopIndex=0,n.endIndex=0,n.demo=!1,n.timer=0,n.animationId=0,n.FPS=16.6,n.cells=[],n.cellImgs=[],n.initData(e),n.initComputed(),n.initWatch();var r=[[]];return n.prizes&&(r=n.prizes.map((function(t){return t.imgs}))),n.button&&(r[n.cols*n.rows-1]=n.button.imgs),n.init(r),n}return e(i,t),i.prototype.initData=function(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)},i.prototype.initComputed=function(){var t=this;this.$computed(this,"_defaultConfig",(function(){var i=n({gutter:5,speed:20,accelerationTime:2500,decelerationTime:2500},t.defaultConfig);return i.gutter=t.getLength(i.gutter)*t.dpr,i.speed=i.speed/40,i})),this.$computed(this,"_defaultStyle",(function(){return n({borderRadius:20,fontColor:"#000",fontSize:"18px",fontStyle:"microsoft yahei ui,microsoft yahei,simsun,sans-serif",fontWeight:"400",background:"#fff",shadow:"",wordWrap:!0,lengthLimit:"90%"},t.defaultStyle)})),this.$computed(this,"_activeStyle",(function(){return n({background:"#ffce98",shadow:""},t.activeStyle)}))},i.prototype.initWatch=function(){var t=this;this.$watch("prizes",(function(i,e){var n=[];return e?i&&i.forEach((function(i,r){var o=[],s=e[r];s?i.imgs&&i.imgs.forEach((function(i,e){if(!s.imgs)return o[e]=i;var n=s.imgs[e];n&&t.cellImgs[r][e]?i.src!==n.src&&(o[e]=i):o[e]=i})):o=i.imgs||[],n[r]=o})):n=i.map((function(t){return t.imgs})),t.init(n)})),this.$watch("button",(function(i,e){var n=[],r=t.cols*t.rows-1;if(e&&e.imgs){if(i.imgs){var o=[];i.imgs.forEach((function(i,n){if(!e.imgs)return o[n]=i;var s=e.imgs[n];s&&t.cellImgs[r][n]?i.src!==s.src&&(o[n]=i):o[n]=i})),n[r]=o}}else n[r]=i.imgs;return t.init(n)}))},i.prototype.init=function(t){var i=this;this.setDpr(),this.setHTMLFontSize();var e=this,n=e.box,r=e.canvas,o=e.dpr;if(n){this.boxWidth=r.width=n.offsetWidth*o,this.boxHeight=r.height=n.offsetHeight*o,this.optimizeClarity(r,this.boxWidth,this.boxHeight);var a=function(){i.draw(),i.demo&&i.walk(),i.button&&(r.onclick=function(t){var e,n=i.getGeometricProperty([i.button.x,i.button.y,i.button.col||1,i.button.row||1]),r=n[0],o=n[1],s=n[2],a=n[3];if(t.offsetX<r||t.offsetY<o||t.offsetX>r+s||t.offsetY>o+a)return!1;i.startTime||null===(e=i.startCallback)||void 0===e||e.call(i,t)})},h=0,c=0;s(t,"array")&&(this.draw(),t.forEach((function(t,e){if(!t)return!1;t.forEach((function(t,n){c++,i.loadAndCacheImg(e,n,(function(){h++,c===h&&a.call(i)}))}))}))),c||a.call(this)}},i.prototype.loadAndCacheImg=function(t,i,e){var n=this,r=this.cells[t];if(r&&r.imgs){var o=r.imgs[i];this.cellImgs[t]||(this.cellImgs[t]=[]);var s=new Image;this.cellImgs[t][i]={defaultImg:s},s.src=o.src;var a=0,h=1;if(s.onload=function(){++a===h&&e.call(n)},o.hasOwnProperty("activeSrc")){h++;var c=new Image;this.cellImgs[t][i].activeImg=c,c.src=o.activeSrc,c.onload=function(){++a===h&&e.call(n)}}}},i.prototype.computedWidthAndHeight=function(t,i,e){if(!i.width&&!i.height)return[t.width,t.height];if(i.width&&!i.height){var n=this.getWidth(i.width,e.col);return[n,t.height*(n/t.width)]}if(!i.width&&i.height){var r=this.getHeight(i.height,e.row);return[t.width*(r/t.height),r]}return[this.getWidth(i.width,e.col),this.getHeight(i.height,e.row)]},i.prototype.draw=function(){var t=this,i=this,e=i.ctx,n=i.dpr,o=i._defaultConfig,h=i._defaultStyle,c=i._activeStyle;e.clearRect(0,0,this.boxWidth,this.boxWidth),this.cells=r(this.prizes),this.button&&(this.cells[this.cols*this.rows-1]=this.button),this.cells.forEach((function(t){t.col=t.col||1,t.row=t.row||1})),this.prizeArea=this.blocks.reduce((function(i,r){var o=i.x,a=i.y,h=i.w,c=i.h,f=function(t){var i=t.padding.replace(/px/g,"").split(" ").map((function(t){return~~t}))||[0],e=0,n=0,r=0,o=0;switch(i.length){case 1:e=n=r=o=i[0];break;case 2:e=n=i[0],r=o=i[1];break;case 3:e=i[0],r=o=i[1],n=i[2];break;default:e=i[0],n=i[1],r=i[2],o=i[3]}var a={paddingTop:e,paddingBottom:n,paddingLeft:r,paddingRight:o};for(var h in a)a[h]=t.hasOwnProperty(h)&&s(t[h],"string","number")?~~String(t[h]).replace(/px/g,""):a[h];return[e,n,r,o]}(r).map((function(t){return t*n})),u=f[0],d=f[1],g=f[2],p=f[3],m=r.borderRadius?t.getLength(r.borderRadius)*n:0;return l(e,o,a,h,c,m,t.handleBackground(o,a,h,c,r.background)),{x:o+g,y:a+u,w:h-g-p,h:c-u-d}}),{x:0,y:0,w:this.boxWidth,h:this.boxHeight}),this.cellWidth=(this.prizeArea.w-o.gutter*(this.cols-1))/this.cols,this.cellHeight=(this.prizeArea.h-o.gutter*(this.rows-1))/this.rows,this.cells.forEach((function(i,r){var o=t.getGeometricProperty([i.x,i.y,i.col,i.row]),s=o[0],f=o[1],u=o[2],d=o[3],g=r===t.currIndex%t.prizes.length>>0,p=(g?c.shadow:i.shadow||h.shadow).replace(/px/g,"").split(",")[0].split(" ").map((function(t,i){return i<3?Number(t)*n:t}));4===p.length&&(e.shadowColor=p[3],e.shadowOffsetX=p[0],e.shadowOffsetY=p[1],e.shadowBlur=p[2],p[0]>0?u-=p[0]:(u+=p[0],s-=p[0]),p[1]>0?d-=p[1]:(d+=p[1],f-=p[1])),l(e,s,f,u,d,t.getLength(i.borderRadius?i.borderRadius:h.borderRadius)*n,t.handleBackground(s,f,u,d,i.background,g)),e.shadowColor="rgba(255, 255, 255, 0)",e.shadowOffsetX=0,e.shadowOffsetY=0,e.shadowBlur=0,i.imgs&&i.imgs.forEach((function(n,o){if(!t.cellImgs[r])return!1;var a=t.cellImgs[r][o];if(!a)return!1;var h=g&&a.activeImg||a.defaultImg,c=t.computedWidthAndHeight(h,n,i),u=c[0],l=c[1];e.drawImage(h,s+t.getOffsetX(u,i.col),f+t.getHeight(n.top,i.row),u,l)})),i.fonts&&i.fonts.forEach((function(r){var o=g&&c.fontStyle?c.fontStyle:r.fontStyle||h.fontStyle,u=g&&c.fontWeight?c.fontWeight:r.fontWeight||h.fontWeight,l=g&&c.fontSize?t.getLength(c.fontSize):t.getLength(r.fontSize||h.fontSize),d=g&&c.lineHeight?c.lineHeight:r.lineHeight||h.lineHeight||r.fontSize||h.fontSize;e.font=u+" "+l*n+"px "+o,e.fillStyle=g&&c.fontColor?c.fontColor:r.fontColor||h.fontColor;var p=[],m=String(r.text);if(r.hasOwnProperty("wordWrap")?r.wordWrap:h.wordWrap){m=a(m);for(var v="",y=0;y<m.length;y++){v+=m[y],e.measureText(v).width>t.getWidth(r.lengthLimit||h.lengthLimit,i.col)&&(p.push(v.slice(0,-1)),v=m[y])}v&&p.push(v),p.length||p.push(m)}else p=m.split("\n");p.forEach((function(o,a){e.fillText(o,s+t.getOffsetX(e.measureText(o).width,i.col),f+t.getHeight(r.top,i.row)+(a+1)*t.getLength(d)*n)}))}))}))},i.prototype.handleBackground=function(t,i,e,n,r,o){void 0===o&&(o=!1);var s=this,a=s.ctx,h=s._defaultStyle,c=s._activeStyle;return(r=o?c.background:r||h.background).includes("linear-gradient")&&(r=function(t,i,e,n,r,o){var s=/linear-gradient\((.+)\)/.exec(o)[1].split(",").map((function(t){return t.trim()})),a=s.shift(),h=[0,0,0,0];if(a.includes("deg")){var c=function(t){return Math.tan(t/180*Math.PI)};(a=a.slice(0,-3)%360)>=0&&a<45?h=[i,e+r,i+n,e+r-n*c(a-0)]:a>=45&&a<90?h=[i,e+r,i+n-r*c(a-45),e]:a>=90&&a<135?h=[i+n,e+r,i+n-r*c(a-90),e]:a>=135&&a<180?h=[i+n,e+r,i,e+n*c(a-135)]:a>=180&&a<225?h=[i+n,e,i,e+n*c(a-180)]:a>=225&&a<270?h=[i+n,e,i+r*c(a-225),e+r]:a>=270&&a<315?h=[i,e,i+r*c(a-270),e+r]:a>=315&&a<360&&(h=[i,e,i+n,e+r-n*c(a-315)])}else a.includes("top")?h=[i,e+r,i,e]:a.includes("bottom")?h=[i,e,i,e+r]:a.includes("left")?h=[i+n,e,i,e]:a.includes("right")&&(h=[i,e,i+n,e]);var f=t.createLinearGradient.apply(t,h.map((function(t){return t>>0})));return s.reduce((function(t,i,e){var n=i.split(" ");return 1===n.length?t.addColorStop(e,n[0]):2===n.length&&t.addColorStop.apply(t,n),t}),f)}(a,t,i,e,n,r)),r},i.prototype.play=function(){this.startTime||(clearInterval(this.timer),cancelAnimationFrame(this.animationId),this.startTime=Date.now(),this.prizeFlag=void 0,this.run())},i.prototype.stop=function(t){this.prizeFlag=t%this.prizes.length},i.prototype.run=function(t){void 0===t&&(t=0);var i=this,e=i.currIndex,n=i.prizes,r=i.prizeFlag,o=i.startTime,s=i._defaultConfig,a=Date.now()-o;if(a>=s.accelerationTime&&void 0!==r){this.FPS=a/t,this.endTime=Date.now(),this.stopIndex=e;for(var h=0;++h;){var c=n.length*h+r-(e>>0);if(g(this.FPS,this.stopIndex,c,s.decelerationTime)-this.stopIndex>s.speed){this.endIndex=c;break}}return cancelAnimationFrame(this.animationId),this.slowDown()}this.currIndex=(e+d(a,.1,s.speed,s.accelerationTime))%n.length,this.draw(),this.animationId=window.requestAnimationFrame(this.run.bind(this,t+1))},i.prototype.slowDown=function(){var t,i=this,e=i.prizes,r=i.prizeFlag,o=i.stopIndex,s=i.endIndex,a=i._defaultConfig,h=Date.now()-this.endTime;if(h>a.decelerationTime)return this.startTime=0,null===(t=this.endCallback)||void 0===t||t.call(this,n({},e.find((function(t,i){return i===r})))),cancelAnimationFrame(this.animationId);this.currIndex=g(h,o,s,a.decelerationTime)%e.length,this.draw(),this.animationId=window.requestAnimationFrame(this.slowDown.bind(this))},i.prototype.walk=function(){var t=this;clearInterval(this.timer),this.timer=window.setInterval((function(){t.currIndex+=1,t.draw()}),1300)},i.prototype.getGeometricProperty=function(t){var i=t[0],e=t[1],n=t[2],r=t[3],o=this.cellWidth,s=this.cellHeight,a=this._defaultConfig.gutter,h=[this.prizeArea.x+(o+a)*i,this.prizeArea.y+(s+a)*e];return n&&r&&h.push(o*n+a*(n-1),s*r+a*(r-1)),h},i.prototype.getLength=function(t){return s(t,"number")?t:s(t,"string")?this.changeUnits(t,{clean:!0}):0},i.prototype.getWidth=function(t,i){return void 0===i&&(i=1),s(t,"number")?t*this.dpr:s(t,"string")?this.changeUnits(t,{denominator:this.cellWidth*i+this._defaultConfig.gutter*(i-1)}):0},i.prototype.getHeight=function(t,i){return void 0===i&&(i=1),s(t,"number")?t*this.dpr:s(t,"string")?this.changeUnits(t,{denominator:this.cellHeight*i+this._defaultConfig.gutter*(i-1)}):0},i.prototype.getOffsetX=function(t,i){return void 0===i&&(i=1),(this.cellWidth*i+this._defaultConfig.gutter*(i-1)-t)/2},i}(o);t.LuckyGrid=m,t.LuckyWheel=p,Object.defineProperty(t,"__esModule",{value:!0})}));

No alert changes

Improved metrics

Total package byte prevSize

219707

increased by11.85%

Lines of code

3449

increased by4.64%

No dependency changes