https://350store.org/assets/TmlMagicModel.c2bb0a97.js

1import{N as u,D as h,E as p,W as f,Q as w}from"./vue.e6b86939.js";import{_ as y,ao as n,h as c}from"./index.e14bda51.js";import{O as v,a as g}from"./OmniCanvas.b9dea325.js";import{O as I}from"./bounds.4efa41f4.js";import"./sentry.09480738.js";import"./cjs.0177d649.js";import"./hexToHsv.0bba6bde.js";import"./isBase64.b96c9a7e.js";import"./animation.7ad64808.js";const x={name:"TmlMagicModel",components:{OmniCanvas:v},props:{model:{type:Object,required:!0},design:{type:String,required:!1},width:{type:Number,required:!0},height:{type:Number,required:!0},zoom:{type:Number,default:1},filterDesign:{type:Boolean,default:!0}},data(){return{designLoaded:!1,modelLoaded:!1,omnisModelImage:null,omnisDesignImage:null,loaded:!1}},computed:{imagesLoaded(){return this.designLoaded&&this.modelLoaded}},watch:{loaded:{immediate:!0,handler(e){e&&this.$emit("loaded")}}},mounted(){this.loadImages()},methods:{getImage(){if(!this.loaded||!this.modelCanvas)return null;const e=new Image;return e.crossOrigin="Anonymous",e.src=this.modelCanvas.export("image/webp",.95,1,1),e},initCanvas(e){this.modelCanvas=e;const i=new n(this.width,this.height),a=new n(Math.max(this.width,this.height),Math.max(this.width,this.height)).copy().subtract(i).divide(2),s=new I({position:a,width:i.x,height:i.y,fixed:!0});e.updateBounds(s),this.modelCanvas.insert(this.omnisModelImage),this.omnisDesignImage&&this.modelCanvas.insert(this.omnisDesignImage),this.loaded=!0},loadImages(){const e=new n(this.width,this.height),i=new Image,t=new Image;i.onload=()=>{const a=new n(i.naturalWidth,i.naturalHeight),s=Math.max(e.x/a.x,e.y/a.y),m=a.x/this.model.dimensions.source,o=a.copy().multiply(s).multiply(m),d=e.copy().subtract(o).divide(2),l=new g({img:i,width:o.x,height:o.y,controllable:!1,vignettable:!0,position:d,z:1,source:"magicModel",mipMapsEnabled:!1});if(this.design){const r=new g({img:t,width:this.model.dimensions.w*s,height:this.model.dimensions.h*s,controllable:!1,vignettable:!0,position:new n(this.model.dimensions.x*s+d.x,this.model.dimensions.y*s+d.y),z:2,source:"magicModel",filters:this.filterDesign?{desaturate:.175,opacity:.925,subtractBrightness:24,relativeOpacity:{min:.75,max:1}}:null,mipMapsEnabled:!1});r.crossOrigin="Anonymous",this.omnisDesignImage=r}l.crossOrigin="Anonymous",this.omnisModelImage=l,this.modelLoaded=!0},t.onload=()=>{this.designLoaded=!0},this.design?(t.crossOrigin="Anonymous",t.src=c(this.design)):this.designLoaded=!0,i.crossOrigin="Anonymous",i.src=c(this.model.image)}}},M={class:"tml-magic-model"};function b(e,i,t,a,s,m){const o=u("omni-canvas");return h(),p("div",M,[m.imagesLoaded?(h(),f(o,{key:0,name:"magic-model-canvas",class:"model-canvas",width:Math.max(t.width,t.height),height:Math.max(t.width,t.height),fade:"alpha",onInitialised:m.initCanvas},null,8,["width","height","onInitialised"])):w("",!0)])}const N=y(x,[["render",b]]);export{N as default};
2//# sourceMappingURL=TmlMagicModel.c2bb0a97.js.map