import{t as x}from"./debounce-Xd493GvO.js";import{r as c,c as g,w as _,j as b,X as w,B as I,z as M,D as C}from"./vue-BJk78QHK.js";const k={style:{overflow:"hidden"}},j=Object.assign({name:"Canvas1"},{__name:"Canvas1",props:{propValue:{type:Object,required:!0,default:()=>({})},element:{type:Object,default:()=>({})}},setup(h){const u=h,r=c(null),l=c(null),o=c(null),d=g(()=>{const t=u.element.style.width,a=u.element.style.height;return{width:t,height:a}});_(d,x(t=>{o.value&&(clearInterval(o.value),o.value=null),v()},1e3),{deep:!0}),b(()=>{r.value=r.value||document.createElement("canvas"),l.value=r.value.getContext("2d"),v()}),w(()=>{o.value&&(clearInterval(o.value),o.value=null)});function v(){const{width:t,height:a}=u.element.style;if(r.value&&(r.value.width=Number.parseInt(t)||0,r.value.height=Number.parseInt(a)||0,r.value.getContext)){const s=Number.parseInt(t)||0,n=Number.parseInt(a)||0;l.value.strokeStyle="rgba(174,194,224,0.5)",l.value.lineWidth=1,l.value.lineCap="round";const e=1e3,i=[];for(let m=0;m<e;m++)i.push({x:Math.random()*s,y:Math.random()*n,l:Math.random()*1,xs:-4+Math.random()*4+2,ys:Math.random()*10+10});const y=i.slice();o.value&&clearInterval(o.value),o.value=setInterval(()=>{f(s,n,y)},40)}}function f(t,a,s){l.value.clearRect(0,0,t,a);for(let n=0;n<s.length;n++){const e=s[n];l.value.beginPath(),l.value.moveTo(e.x,e.y),l.value.lineTo(e.x+e.l*e.xs,e.y+e.l*e.ys),l.value.stroke()}p(t,a,s)}function p(t,a,s){for(let n=0;n<s.length;n++){const e=s[n];e.x+=e.xs,e.y+=e.ys,(e.x>t||e.y>a)&&(e.x=Math.random()*t,e.y=-20)}}return(t,a)=>(M(),I("div",k,[C("canvas",{ref_key:"canvas",ref:r},null,512)]))}});export{j as default};
