search

Foliotek / Croppie

A Javascript Image Cropper
http://foliotek.github.io/Croppie
MIT License
2.56k stars 885 forks source link

Clarification - Can I update croppie programatically after initialization? #697

Closed jdylanmc closed 4 years ago

jdylanmc commented 4 years ago

After Croppie has been initialized, is it possible to programatically zoom/move the crop point? How do you do this?

thedustinsmith commented 4 years ago

The bind({opts}) method should help with this.

http://foliotek.github.io/Croppie/#bind

jdylanmc commented 4 years ago

When using bind, do you always have to pass in the image? I just want to bind points but this seems to cause issues.

croppie.js:190 Uncaught (in promise) TypeError: Cannot read property 'match' of undefined at croppie.js:190 at new Promise () at loadImage (croppie.js:181) at Croppie._bind (croppie.js:1312) at Croppie.bind (croppie.js:1594) ...

thedustinsmith commented 4 years ago

Oops - yeah good point. You probably always need to include the url.

jdylanmc commented 4 years ago

Also, when using bind it only appears to work if the croppie has been interacted with previously. Is there a way to get around this?

I basically am initializing multiple croppies, and then allowing a user to select a "Focal Point" of my image. Moving the focal point element around programatically updates all of the croppies to follow.

thedustinsmith commented 4 years ago

I'm not familiar with that bug, if it is one can you provide some example code jsbin/jsfiddle/codepen?

jdylanmc commented 4 years ago

Sorry, I have just realized it's because I'm hiding Croppies behind modals. The modals have their visibility set to hidden at the time I'm trying to programatically bind them. I believe I need to set the modal opacity to 0 and push them down with z-index instead. I'll tinker with it and let you know if there really is a bug.

Thanks for your help.