search

ValentinH / react-easy-crop

A React component to crop images/videos with easy interactions
https://valentinh.github.io/react-easy-crop/
MIT License
2.34k stars 167 forks source link

Improve callbacks while zooming #552

Open ofekudi opened 4 months ago

ofekudi commented 4 months ago

Describe the bug There are two main problems:

  1. The callback for onCropComplete is being called repeatedly while zooming - so they are being simultaneously called
  2. While zooming, the onZoomChange is being called a lot of times (maybe it's possible to throttle it)

To Reproduce Steps to reproduce the behavior:

  1. Add logs in the onCropComplete and onZoomChange callbacks
  2. Zoom in

Expected behavior

  1. onCropComplete will be called only once - after you finish zooming (the same behavior as happens with onCropChange)
  2. onZoomChange will be called less frequently

Here's a sample of the logs while zooming in:

image

Thanks for your help! This package is super useful!

ValentinH commented 7 hours ago

Sorry for missing this issue. I understand your point. The problem with the zoom is that it's harder to detect that the zoom gesture is complete compared to other gestures. This is due to the wheel event not having a start/end specific event. I guess we could add some internal logic to only fire the onCropComplete when the wheel event hasn't been received for a while. Basically debouncing it.