import{r as V}from"./request-CEvu378m.js";import{u as y}from"./index-M_JNBppB.js";import{r as m,w as p,j as _,B as C,z as N,D}from"./vue-BJk78QHK.js";import"./element-3_pOinej.js";import"./utils-YI6ye1sf.js";import"./threejs-BafxXW5-.js";import"./vxe-Dx3zSILm.js";const j={style:{overflow:"hidden"}},k=Object.assign({name:"Picture"},{__name:"Picture",props:{propValue:{type:Object,required:!0,default:()=>({})},element:{type:Object,default:()=>({})}},setup(d){const{getImgUrl:w}=y(),l=d,o=m(null),g=m(null),u=m(null),f=m(!0);function c(){var n,s;const{width:e,height:t}=l.element.style;if(g.value.width=e,g.value.height=t,f.value){f.value=!1;let a;(n=l.propValue)!=null&&n.url?a=w((s=l.propValue)==null?void 0:s.url):a=new URL("/assets/logo-DwRDtNJT.png",import.meta.url).href,o.value=new Image,o.value.src=a,o.value.setAttribute("crossOrigin","Anonymous"),o.value.onload=()=>{u.value.drawImage(o.value,0,0,e,t),h()}}else h();if(l.propValue.newColor){const a=l.propValue.newColor;if(a.includes("#")){const r=v(a);i(r)}else{const r=a.replace("rgba(","").replace(")","");i(r.split(","))}}}function h(){const{vertical:e,horizontal:t}=l.propValue.flip,{width:n,height:s}=l.element.style,a=t?-1:1,r=e?-1:1;u.value.clearRect(0,0,n,s),u.value.translate(n/2-n*a/2,s/2-s*r/2),u.value.scale(a,r),u.value.drawImage(o.value,0,0,n,s),u.value.setTransform(1,0,0,1,0,0)}function b(e){const{width:t,height:n}=l.element.style;let s=u.value.getImageData(0,0,t,n),a=s.data;for(let r=0;r<a.length;r+=4)a[r]=Number.parseInt(e[0]),a[r+1]=Number.parseInt(e[1]),a[r+2]=Number.parseInt(e[2]);u.value.putImageData(s,0,0)}function i(e){b(e)}function v(e){let t=[];return t.push(Number.parseInt(e.substring(1,3),16)),t.push(Number.parseInt(e.substring(3,5),16)),t.push(Number.parseInt(e.substring(5),16)),t}p(()=>l.element.style.width,()=>{c()}),p(()=>l.element.style.height,()=>{c()}),p(()=>l.propValue.flip.vertical,()=>{h()}),p(()=>l.propValue.flip.horizontal,()=>{h()}),p(()=>l.propValue.url,()=>{f.value=!0,c()},{deep:!0}),p(()=>l.propValue.newColor,e=>{if(e)if(e.includes("#")){const t=v(e);i(t)}else{const t=e.replace("rgba(","").replace(")","");i(t.split(","))}else c()},{deep:!0});const I=m(null);return _(()=>{l.request&&(I.value=V(l.request,l.element.propValue,"url","")),o.value=new Image,u.value=g.value.getContext("2d"),c(),setTimeout(()=>{const e=l.propValue.newColor;if(e)if(e.includes("#")){const t=v(e);i(t)}else{const t=e.replace("rgba(","").replace(")","");i(t.split(","))}},200)}),(e,t)=>(N(),C("div",j,[D("canvas",{ref_key:"canvas",ref:g},null,512)]))}});export{k as default};
