drill.define(async t=>{await t("./p-viewcon.css");const e=$("body");$.register({tag:"p-viewcon",data:{w:400,h:400,cw:"",ch:"",zoom:1,maxZoom:2,minZoom:.2,moveMode:0},attrs:["w","h","cw","ch"],temp:'\n        <div class="viewcon_main" xv-content></div>\n        <div class="move_mode_area" xv-tar="moveAreaEle" style="display:none;"></div>\n        <div class="prescroller" xv-tar="prescroller">\n            <div class="preScrollCon" xv-tar="preScrollCon"></div>\n            <div class="preScrollMain" xv-tar="preScrollMain"></div>\n        </div>\n        ',watch:{w(t,e){this.$content.style.width=e+"px"},h(t,e){this.$content.style.height=e+"px"},l(){this.refreshView()},t(){this.refreshView()},cw(){this.refreshPreScroller()},ch(){this.refreshPreScroller()},zoom(t,e){e<this.minZoom?this.zoom=this.minZoom:e>this.maxZoom&&(this.zoom=this.maxZoom),this.refreshView()},moveMode(t,e){this.$moveAreaEle.display=e?"":"none"}},proto:{refreshPreScroller(){let t,e,i=this.cw/this.ch;i>1?e=(t=150)/i:t=(e=150)*i,Object.assign(this.$preScrollCon.style,{width:t+"px",height:e+"px"}),Object.assign(this.$prescroller.style,{width:t+"px",height:e+"px"});let s=t/this.cw,o=s*this.w,h=s*this.h,n=this.l*s,r=this.t*s;Object.assign(this.$preScrollMain.style,{width:o+"px",height:h+"px",transform:`translate3d(${n}px,${r}px,0) scale(${this.zoom})`})},addAnime(){this.$content.style.transition="all ease .2s",clearTimeout(this.$content.ele._animeTimer),this.$content.ele._animeTimer=setTimeout(()=>{this.$content.style.transition=""},220)},toCenter(t={}){t.anime&&this.addAnime(),this.l=(this.cw-this.w)/2,this.t=(this.ch-this.h)/2},toPrecentOne(t={}){t.anime&&this.addAnime(),this.zoom=1},toCoverSize(){let{w:t,h:e,cw:i,ch:s}=this,o=1;if(t>i&&(o=(i-50)/t),e>s){let t=(s-50)/e;t<o&&(o=t)}this.zoom=o},refreshView(){this.$content.style.transform=`translate3d(${this.l}px,${this.t}px,0) scale(${this.zoom})`,this.refreshPreScroller()}},attached(){let t,i,s,o;this.cw=this.width,this.ch=this.height,setTimeout(()=>{this.toCenter(),this.toCoverSize()},100);const h=e=>{e=e.originalEvent;let h=t-e.clientX,n=i-e.clientY;this.l=s-h,this.t=o-n},n=()=>{e.off("mousemove",h),e.off("mouseup",n)},r=r=>{r=r.originalEvent,t=r.clientX,i=r.clientY,s=this.l,o=this.t,e.on("mousemove",h),e.on("mouseup",n)},l=()=>{this.moveMode=1,this.on("mousedown",r)},a=()=>{this.moveMode=0,this.off("mousedown",r),n()};let c,m,d=0;window.addEventListener("keydown",t=>{d||"space"===t.code.toLowerCase()&&t.target===document.body&&(d=1,l())}),window.addEventListener("keyup",t=>{"space"===t.code.toLowerCase()&&t.target===document.body&&(d=0,a())}),this.on("mousemove",t=>{let e=t.originalEvent,{offsetX:i,offsetY:s}=e,o=e.target;for(;"p-viewcon"!==o.tagName.toLowerCase();)i+=o.offsetLeft,s+=o.offsetTop,o=o.parentNode;c=i,m=s});let w,v=.01;navigator.userAgent.toLowerCase().includes("windows")&&(v=.003),this.on("mousewheel",t=>{t=t.originalEvent;let{deltaX:e,deltaY:i}=t;if(t.altKey){let t=this.zoom,e=this.w*t,s=this.h*t,o=this.zoom-=i*v;o>this.maxZoom?o=this.maxZoom:o<this.minZoom&&(o=this.minZoom);let h=(this.w*o-e)/2,n=(this.h*o-s)/2,r=0,l=0;return c&&(r=-(c-this.w/2)/this.w*2),m&&(l=-(m-this.h/2)/this.h*2),this.l+=h*r,void(this.t+=n*l)}t.preventDefault();let s=Math.abs(e),o=Math.abs(i),h=0;(s>0&&s<10||o>0&&o<10)&&(h=1),h&&(this.l-=e,this.t-=i,c+=e,m+=i)}),window.addEventListener("resize",t=>{clearTimeout(w),w=setTimeout(()=>{this.cw=this.width,this.ch=this.height},100)})}})});