Trigger crop on a custom event
Hey @bcabanes ,
I would like that the crop is initialized anytime the user takes an action ( move, rotate, etc ) so the user is not dependent on clicking the crop action.
Do you have any plans to roll this out at all ?
I implemented this already, but wondering on your thoughts if there is a better approach or should I submit a Pull Request ?
Thanks
angular-image-cropper.js Here is what I added for it to work.
this.elements.controls.rotateLeft.addEventListener('click', function() {
self.applyRotation(-90);
self.elements.controls.crop.click(); // line added
});
this.elements.controls.rotateRight.addEventListener('click', function() {
self.applyRotation(90);
self.elements.controls.crop.click(); // line added
});
this.elements.controls.zoomIn.addEventListener('click', function() {
self.applyZoomIn(self.zoomInFactor);
self.elements.controls.crop.click(); // line added
});
this.elements.controls.zoomOut.addEventListener('click', function() {
self.applyZoomOut(self.zoomOutFactor);
self.elements.controls.crop.click(); // line added
});
And another in move function
// Move.
this.setOffset(left, top);
this.elements.controls.crop.click(); // line added
I would take an api first and take control over .crop method.
`
this.getApi = (api) => { return this.api = api; };
Now I can use this.api.crop() anywhere I want to. So for example:
Created a function that I can assign to my button.
rotateLeft() { this.api.rotate(-90); this.api.crop(); }
Can also define custom crop callback that can do what I need when an image is crop.