| 12 |
- import{fg as B,x as N,g as O,B as U,e as Z,b2 as j}from"./index-D_EGaVbS.js";function F(s,r){let i,t,o,y=0,w=0,m=0,v=0,f=0;const x=4,d={},T=50,H=200,W=200;s.complete?_():s.onload=_;function M(){t.removeEventListener("mousedown",g),t.removeEventListener("touchstart",g),t.removeEventListener("wheel",P),document.removeEventListener("mouseup",h),document.removeEventListener("touchend",h),document.removeEventListener("mousemove",l),document.removeEventListener("touchmove",l),document.removeEventListener("keypress",D),i.remove(),t.remove(),o.remove()}function R(){t.addEventListener("mousedown",g,!1),t.addEventListener("touchstart",g,!1),t.addEventListener("wheel",P,!1),document.addEventListener("keypress",D,!1)}function _(){s.classList.add("crop-blur"),s.draggable=!1,o=new Image,o.src=s.src,o.draggable=!1,o.classList.add("crop-overlay-image"),r||(r=document.createElement("canvas")),i=document.createElement("div"),i.classList.add("crop-component"),t=document.createElement("div"),t.classList.add("crop-overlay");const e=document.createElement("div");e.classList.add("crop-overlay-color"),i.appendChild(t),s.parentNode.appendChild(i),i.appendChild(o),i.appendChild(s),i.appendChild(e),t.appendChild(o),o.style.maxWidth=s.width+"px",f=s.naturalWidth/s.offsetWidth;const c=s.offsetWidth/2-H/2,a=s.offsetHeight/2-W/2;k(H,W),C(c,a),E(c,a),R()}function k(e,n){m=e*f,v=n*f,t.style.width=e+"px",t.style.height=n+"px"}function C(e,n){w=n*f,y=e*f,o.style.top=-n+"px",o.style.left=-e+"px"}function E(e,n){t.style.top=n+"px",t.style.left=e+"px"}function S(e){d.container_width=t.offsetWidth,d.container_height=t.offsetHeight,d.container_left=t.offsetLeft,d.container_top=t.offsetTop,d.mouse_x=(e.clientX||e.pageX||e.touches&&e.touches[0].clientX)+window.scrollX,d.mouse_y=(e.clientY||e.pageY||e.touches&&e.touches[0].clientY)+window.scrollY}function b(e){e=e*Math.PI*2;const n=Math.floor(t.clientWidth+e),c=Math.floor(t.clientHeight+e),a=o.clientWidth,L=o.clientHeight;let p,u;if(n<T)return;if(n>a)return;p=t.offsetLeft-e/2,u=t.offsetTop-e/2;const A=p+n,X=u+c;p<0&&(p=0),u<0&&(u=0),!(A>a)&&(X>L||(k(n,n),C(p,u),E(p,u)))}function D(e){switch(e.preventDefault(),String.fromCharCode(e.charCode)){case"+":b(x);break;case"-":b(-x);break}}function P(e){e.preventDefault(),b(e.deltaY>0?1:-1)}function g(e){e.preventDefault(),e.stopPropagation(),S(e),document.addEventListener("mousemove",l),document.addEventListener("touchmove",l),document.addEventListener("mouseup",h),document.addEventListener("touchend",h)}function h(e){e.preventDefault(),document.removeEventListener("mouseup",h),document.removeEventListener("touchend",h),document.removeEventListener("mousemove",l),document.removeEventListener("touchmove",l)}function l(e){const n={x:0,y:0};e.preventDefault(),e.stopPropagation(),n.x=e.pageX||e.touches&&e.touches[0].pageX,n.y=e.pageY||e.touches&&e.touches[0].pageY;let c=n.x-(d.mouse_x-d.container_left),a=n.y-(d.mouse_y-d.container_top);const L=t.offsetWidth,p=t.offsetHeight;c<0?c=0:c>o.offsetWidth-L&&(c=o.offsetWidth-L),a<0?a=0:a>o.offsetHeight-p&&(a=o.offsetHeight-p),C(c,a),E(c,a)}function Y(){r.width=m,r.height=v,r.getContext("2d").drawImage(s,y,w,m,v,0,0,m,v)}return{crop:Y,removeHandlers:M}}function G(s){return B(s,"readAsDataURL")}class q extends N{constructor(r={}){super("popup-avatar",{closable:!0}),this.image=new Image,this.cropper={crop:()=>{},removeHandlers:()=>{}},this.h6=document.createElement("h6"),O(this.h6,"Popup.Avatar.Title"),this.btnClose.classList.remove("btn-icon"),this.header.append(this.h6),this.cropContainer=document.createElement("div"),this.cropContainer.classList.add("crop"),this.cropContainer.append(this.image),r.isForum&&this.cropContainer.classList.add("is-forum"),this.input=document.createElement("input"),this.input.type="file",this.input.style.display="none",this.listenerSetter.add(this.input)("change",i=>{const t=i.target.files[0];t&&G(t).then(o=>{this.image=new Image,this.cropContainer.append(this.image),this.image.src=o,this.image.onload=()=>{this.show(),this.cropper=F(this.image,this.canvas),this.input.value=""}})},!1),this.btnConfirm=U("btn-primary btn-color-primary btn-circle btn-crop btn-icon z-depth-1",{noRipple:!0,icon:"check"}),Z(this.btnConfirm,()=>{this.cropper.crop(),this.hide(),this.canvas.toBlob(i=>{this.blob=i,this.darkenCanvas(),this.resolve()},"image/jpeg",1)},{listenerSetter:this.listenerSetter}),this.container.append(this.cropContainer,this.btnConfirm,this.input),this.addEventListener("closeAfterTimeout",()=>{this.cropper.removeHandlers(),this.image&&this.image.remove()})}resolve(){this.onCrop(()=>j.upload(this.blob))}open(r,i){this.canvas=r,this.onCrop=i,this.input.click()}darkenCanvas(){const r=this.canvas.getContext("2d");r.fillStyle="rgba(0, 0, 0, 0.3)",r.fillRect(0,0,this.canvas.width,this.canvas.height)}}export{q as P,G as r};
- //# sourceMappingURL=avatar-C4f7PAeP.js.map
|