https://opensports.net/_next/static/chunks/92643-73b579e3e5b501ee.js

1"use strict";
2!function(){try{var e="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{},n=(new e.Error).stack;n&&(e._sentryDebugIds=e._sentryDebugIds||{},e._sentryDebugIds[n]="44ce832f-36db-5179-bcfa-aec660aa306f")}catch(e){}}();
3(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[92643],{92643:function(t,e,i){i.d(e,{Z:function(){return R}});var s=i(67294),a=Object.defineProperty,o=Object.defineProperties,h=Object.getOwnPropertyDescriptors,r=Object.getOwnPropertySymbols,n=Object.prototype.hasOwnProperty,l=Object.prototype.propertyIsEnumerable,d=(t,e,i)=>e in t?a(t,e,{enumerable:!0,configurable:!0,writable:!0,value:i}):t[e]=i,c=(t,e)=>{for(var i in e||(e={}))n.call(e,i)&&d(t,i,e[i]);if(r)for(var i of r(e))l.call(e,i)&&d(t,i,e[i]);return t},g=(t,e)=>o(t,h(e)),p=(t,e)=>{var i={};for(var s in t)n.call(t,s)&&0>e.indexOf(s)&&(i[s]=t[s]);if(null!=t&&r)for(var s of r(t))0>e.indexOf(s)&&l.call(t,s)&&(i[s]=t[s]);return i},u=(t,e,i)=>new Promise((s,a)=>{var o=t=>{try{r(i.next(t))}catch(t){a(t)}},h=t=>{try{r(i.throw(t))}catch(t){a(t)}},r=t=>t.done?s(t.value):Promise.resolve(t.value).then(o,h);r((i=i.apply(t,e)).next())}),m=t=>!!t.match(/^\s*data:([a-z]+\/[a-z]+(;[a-z-]+=[a-z-]+)?)?(;base64)?,[a-z0-9!$&',()*+;=\-._~:@/?%\s]*\s*$/i),v=(t,e)=>new Promise((i,s)=>{let a=new Image;a.onload=()=>i(a),a.onerror=s,!m(t)&&e&&(a.crossOrigin=e),a.src=t}),w=t=>new Promise((e,i)=>{let s=new FileReader;s.onload=t=>{var s;try{if(!(null==(s=null==t?void 0:t.target)?void 0:s.result))throw Error("No image data");let i=v(t.target.result);e(i)}catch(t){i(t)}},s.readAsDataURL(t)}),f=()=>{let t=!1;try{let e=Object.defineProperty({},"passive",{get:function(){t=!0}}),i=()=>{};window.addEventListener("test",i,e),window.removeEventListener("test",i,e)}catch(e){t=!1}return t},y="undefined"!=typeof window&&"undefined"!=typeof navigator&&("ontouchstart"in window||navigator.maxTouchPoints>0),b="undefined"!=typeof File,x=(t,e,i,s,a,o)=>{if(0===o)t.rect(e,i,s,a);else{let h=s-o,r=a-o;t.translate(e,i),t.arc(o,o,o,Math.PI,1.5*Math.PI),t.lineTo(h,0),t.arc(h,o,o,1.5*Math.PI,2*Math.PI),t.lineTo(s,r),t.arc(h,r,o,2*Math.PI,.5*Math.PI),t.lineTo(o,a),t.arc(o,r,o,.5*Math.PI,Math.PI),t.closePath(),t.translate(-e,-i)}},M=(t,e,i,s,a,o)=>{t.fillStyle=o;let h=s/3,r=a/3;t.fillRect(e,i,1,a),t.fillRect(h+e,i,1,a),t.fillRect(2*h+e,i,1,a),t.fillRect(3*h+e,i,1,a),t.fillRect(4*h+e,i,1,a),t.fillRect(e,i,s,1),t.fillRect(e,r+i,s,1),t.fillRect(e,2*r+i,s,1),t.fillRect(e,3*r+i,s,1),t.fillRect(e,4*r+i,s,1)},C={x:.5,y:.5},I=class extends s.Component{constructor(){super(...arguments),this.canvas=s.createRef(),this.pixelRatio="undefined"!=typeof window&&window.devicePixelRatio?window.devicePixelRatio:1,this.state={drag:!1,my:void 0,mx:void 0,image:C},this.handleImageReady=t=>{var e,i;let s=g(c({},this.getInitialSize(t.width,t.height)),{resource:t,x:.5,y:.5});this.setState({drag:!1,image:s},this.props.onImageReady),null==(i=(e=this.props).onLoadSuccess)||i.call(e,s)},this.clearImage=()=>{let t=this.getCanvas();this.getContext().clearRect(0,0,t.width,t.height),this.setState({image:C})},this.handleMouseDown=t=>{t.preventDefault(),this.setState({drag:!0,mx:void 0,my:void 0})},this.handleTouchStart=t=>{this.setState({drag:!0,mx:void 0,my:void 0})},this.handleMouseUp=()=>{var t,e;this.state.drag&&(this.setState({drag:!1}),null==(e=(t=this.props).onMouseUp)||e.call(t))},this.handleMouseMove=t=>{var e,i,s,a;if(!this.state.drag)return;t.preventDefault();let o="targetTouches"in t?t.targetTouches[0].pageX:t.clientX,h="targetTouches"in t?t.targetTouches[0].pageY:t.clientY;this.setState({mx:o,my:h});let r=this.props.rotate;if(r%=360,r=r<0?r+360:r,this.state.mx&&this.state.my&&this.state.image.width&&this.state.image.height){let t=this.state.mx-o,s=this.state.my-h,a=this.state.image.width*this.props.scale,n=this.state.image.height*this.props.scale,{x:l,y:d}=this.getCroppingRect();l*=a,d*=n;let g=Math.cos(Math.PI/180*r),p=Math.sin(Math.PI/180*r),u=l+t*g+s*p,m=d+-t*p+s*g,v={x:u/a+1/this.props.scale*this.getXScale()/2,y:m/n+1/this.props.scale*this.getYScale()/2};null==(i=(e=this.props).onPositionChange)||i.call(e,v),this.setState({image:c(c({},this.state.image),v)})}null==(a=(s=this.props).onMouseMove)||a.call(s,t)}}componentDidMount(){this.props.disableHiDPIScaling&&(this.pixelRatio=1);let t=this.getContext();this.props.image&&this.loadImage(this.props.image),this.paint(t);let e=!!f()&&{passive:!1};document.addEventListener("mousemove",this.handleMouseMove,e),document.addEventListener("mouseup",this.handleMouseUp,e),y&&(document.addEventListener("touchmove",this.handleMouseMove,e),document.addEventListener("touchend",this.handleMouseUp,e))}componentDidUpdate(t,e){var i,s;this.props.image&&(this.props.image!==t.image||this.props.width!==t.width||this.props.height!==t.height||this.props.backgroundColor!==t.backgroundColor)?this.loadImage(this.props.image):this.props.image||e.image===C||this.clearImage();let a=this.getContext();a.clearRect(0,0,this.getCanvas().width,this.getCanvas().height),this.paint(a),this.paintImage(a,this.state.image,this.props.border),(t.image!==this.props.image||t.width!==this.props.width||t.height!==this.props.height||t.position!==this.props.position||t.scale!==this.props.scale||t.rotate!==this.props.rotate||e.my!==this.state.my||e.mx!==this.state.mx||e.image.x!==this.state.image.x||e.image.y!==this.state.image.y)&&(null==(s=(i=this.props).onImageChange)||s.call(i))}getCanvas(){if(!this.canvas.current)throw Error("No canvas found, please report this to: https://github.com/mosch/react-avatar-editor/issues");return this.canvas.current}getContext(){let t=this.getCanvas().getContext("2d");if(!t)throw Error("No context found, please report this to: https://github.com/mosch/react-avatar-editor/issues");return t}componentWillUnmount(){document.removeEventListener("mousemove",this.handleMouseMove,!1),document.removeEventListener("mouseup",this.handleMouseUp,!1),y&&(document.removeEventListener("touchmove",this.handleMouseMove,!1),document.removeEventListener("touchend",this.handleMouseUp,!1))}isVertical(){return!this.props.disableCanvasRotation&&this.props.rotate%180!=0}getBorders(t=this.props.border){return Array.isArray(t)?t:[t,t]}getDimensions(){let{width:t,height:e,rotate:i,border:s}=this.props,a={width:0,height:0},[o,h]=this.getBorders(s);return this.isVertical()?(a.width=e,a.height=t):(a.width=t,a.height=e),a.width+=2*o,a.height+=2*h,{canvas:a,rotate:i,width:t,height:e,border:s}}

3getImage(){let t=this.getCroppingRect(),e=this.state.image;if(!e.resource)throw Error("No image resource available, please report this to: https://github.com/mosch/react-avatar-editor/issues");t.x*=e.resource.width,t.y*=e.resource.height,t.width*=e.resource.width,t.height*=e.resource.height;let i=document.createElement("canvas");this.isVertical()?(i.width=t.height,i.height=t.width):(i.width=t.width,i.height=t.height);let s=i.getContext("2d");if(!s)throw Error("No context found, please report this to: https://github.com/mosch/react-avatar-editor/issues");return s.translate(i.width/2,i.height/2),s.rotate(this.props.rotate*Math.PI/180),s.translate(-(i.width/2),-(i.height/2)),this.isVertical()&&s.translate((i.width-i.height)/2,(i.height-i.width)/2),this.props.backgroundColor&&(s.fillStyle=this.props.backgroundColor,s.fillRect(0,0,i.width,i.height)),s.drawImage(e.resource,-t.x,-t.y),i}getImageScaledToCanvas(){let{width:t,height:e}=this.getDimensions(),i=document.createElement("canvas");return this.isVertical()?(i.width=e,i.height=t):(i.width=t,i.height=e),this.paintImage(i.getContext("2d"),this.state.image,0,1),i}getXScale(){if(!this.state.image.width||!this.state.image.height)throw Error("Image dimension is unknown.");return Math.min(1,this.props.width/this.props.height/(this.state.image.width/this.state.image.height))}getYScale(){if(!this.state.image.width||!this.state.image.height)throw Error("Image dimension is unknown.");return Math.min(1,this.props.height/this.props.width/(this.state.image.height/this.state.image.width))}getCroppingRect(){let t=this.props.position||{x:this.state.image.x,y:this.state.image.y},e=1/this.props.scale*this.getXScale(),i=1/this.props.scale*this.getYScale(),s={x:t.x-e/2,y:t.y-i/2,width:e,height:i},a=0,o=1-s.width,h=0,r=1-s.height;return(this.props.disableBoundaryChecks||e>1||i>1)&&(a=-s.width,o=1,h=-s.height,r=1),g(c({},s),{x:Math.max(a,Math.min(s.x,o)),y:Math.max(h,Math.min(s.y,r))})}loadImage(t){return u(this,null,function*(){var e,i,s,a;if(b&&t instanceof File)try{let e=yield w(t);this.handleImageReady(e)}catch(t){null==(i=(e=this.props).onLoadFailure)||i.call(e)}else if("string"==typeof t)try{let e=yield v(t,this.props.crossOrigin);this.handleImageReady(e)}catch(t){null==(a=(s=this.props).onLoadFailure)||a.call(s)}})}getInitialSize(t,e){let i,s;let a=this.getDimensions();return a.height/a.width>e/t?s=Math.round((i=a.height)/e*t):i=Math.round((s=a.width)/t*e),{height:i,width:s}}paintImage(t,e,i,s=this.pixelRatio){if(!e.resource)return;let a=this.calculatePosition(e,i);t.save(),t.translate(t.canvas.width/2,t.canvas.height/2),t.rotate(this.props.rotate*Math.PI/180),t.translate(-(t.canvas.width/2),-(t.canvas.height/2)),this.isVertical()&&t.translate((t.canvas.width-t.canvas.height)/2,(t.canvas.height-t.canvas.width)/2),t.scale(s,s),t.globalCompositeOperation="destination-over",t.drawImage(e.resource,a.x,a.y,a.width,a.height),this.props.backgroundColor&&(t.fillStyle=this.props.backgroundColor,t.fillRect(0,0,t.canvas.width,t.canvas.height)),t.restore()}calculatePosition(t=this.state.image,e){let[i,s]=this.getBorders(e);if(!t.width||!t.height)throw Error("Image dimension is unknown.");let a=this.getCroppingRect(),o=t.width*this.props.scale,h=t.height*this.props.scale,r=-a.x*o,n=-a.y*h;return this.isVertical()?(r+=s,n+=i):(r+=i,n+=s),{x:r,y:n,height:h,width:o}}paint(t){t.save(),t.scale(this.pixelRatio,this.pixelRatio),t.translate(0,0),t.fillStyle="rgba("+this.props.color.slice(0,4).join(",")+")";let e=this.props.borderRadius,i=this.getDimensions(),[s,a]=this.getBorders(i.border),o=i.canvas.height,h=i.canvas.width;e=Math.min(e=Math.max(e,0),h/2-s,o/2-a),t.beginPath(),x(t,s,a,h-2*s,o-2*a,e),t.rect(h,0,-h,o),t.fill("evenodd"),this.props.borderColor&&(t.strokeStyle="rgba("+this.props.borderColor.slice(0,4).join(",")+")",t.lineWidth=1,t.beginPath(),x(t,s+.5,a+.5,h-2*s-1,o-2*a-1,e),t.stroke()),this.props.showGrid&&M(t,s,a,h-2*s,o-2*a,this.props.gridColor),t.restore()}render(){let t=this.props,{scale:e,rotate:i,image:a,border:o,borderRadius:h,width:r,height:n,position:l,color:d,backgroundColor:u,style:m,crossOrigin:v,onLoadFailure:w,onLoadSuccess:f,onImageReady:y,onImageChange:b,onMouseUp:x,onMouseMove:M,onPositionChange:C,disableBoundaryChecks:I,disableHiDPIScaling:R,disableCanvasRotation:P,showGrid:S,gridColor:E,borderColor:k}=t,D=p(t,["scale","rotate","image","border","borderRadius","width","height","position","color","backgroundColor","style","crossOrigin","onLoadFailure","onLoadSuccess","onImageReady","onImageChange","onMouseUp","onMouseMove","onPositionChange","disableBoundaryChecks","disableHiDPIScaling","disableCanvasRotation","showGrid","gridColor","borderColor"]),L=this.getDimensions(),O={width:L.canvas.width,height:L.canvas.height,cursor:this.state.drag?"grabbing":"grab",touchAction:"none"},T={width:L.canvas.width*this.pixelRatio,height:L.canvas.height*this.pixelRatio,onMouseDown:this.handleMouseDown,onTouchStart:this.handleTouchStart,style:c(c({},O),m)};return s.createElement("canvas",g(c(c({},T),D),{ref:this.canvas}))}};I.defaultProps={scale:1,rotate:0,border:25,borderRadius:0,width:200,height:200,color:[0,0,0,.5],showGrid:!1,gridColor:"#666",disableBoundaryChecks:!1,disableHiDPIScaling:!1,disableCanvasRotation:!0};var R=I}}]);
4//# sourceMappingURL=92643-73b579e3e5b501ee.js.map
5//# debugId=44ce832f-36db-5179-bcfa-aec660aa306f