Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
static getDerivedStateFromProps(nextProps, state) {
if (state.crop) {
// update crop for editor container aspect-ratio change
return {
crop: makeAspectCrop(
{
...state.crop,
aspect: nextProps.aspectRatio
},
state.imageAspectRatio
)
}
}
return null
}
onImageLoaded = image => {
const { cropShape } = this.props
let { crop } = this.props
// when the shape is a circle the aspect should be 1
if (cropShape === 'circle') {
crop = { ...crop, aspect: 1 }
}
const cropProperties = makeAspectCrop(
{
...crop,
},
image.width / image.height
)
const pixelToCrop = getPixelCrop(image, cropProperties)
this.setState({
crop: cropProperties,
originalImage: image,
pixelCrop: pixelToCrop,
})
}
onImageLoaded(image) {
const imageAspectRatio = image.width / image.height
const initialCrop = {
x: 0,
y: 0,
width: 100,
aspect: this.props.aspectRatio
}
this.setState({
imageAspectRatio,
crop: makeAspectCrop(initialCrop, imageAspectRatio)
})
}
onImageLoaded = (image) => {
const crop = makeAspectCrop({
x: 0,
y: 0,
aspect: 16 / 9,
width: 50,
}, image.width / image.height);
const pixelCrop = {
x: Math.round(image.naturalWidth * (crop.x / 100)),
y: Math.round(image.naturalHeight * (crop.y / 100)),
width: Math.round(image.naturalWidth * (crop.width / 100)),
height: Math.round(image.naturalHeight * (crop.height / 100)),
};
this.renderCropPreview(image, pixelCrop);
this.setState({ crop });
private onImageLoaded = (image: HTMLImageElement) => {
const { imageRatio } = this.props;
this.setState({
crop: ReactCrop.makeAspectCrop({
x: 10,
y: 10,
width: 100,
height: 100,
aspect: imageRatio,
}, image.naturalWidth / image.naturalHeight)
});
}
onImageLoaded = image => {
this.setState({
crop: makeAspectCrop({
x: 25,
y: 25,
aspect: 1 / 1,
width: 227,
},
image.width / image.height),
image: image,
});
}