I'm using the JavaScript Croppie library to create an image cropper. I've been given the task of adding buttons that give users the option to crop to a certain aspect ratio if they want instead of just resizing it themselves (the current options I've included are 9 by 16, 1 by 1, and 16 by 9). To do this, I wrote a function called changeSize that gets passed in the new width and new height of the photo cropper.
Actual Behavior
My buttons work and the aspect ratio successfully changes, but the only problem is that it makes me reupload the image every time I click on a different aspect ratio button. How can I fix this problem? Perhaps by saving the image as a variable?
Expected Behavior
I'm using the JavaScript Croppie library to create an image cropper. I've been given the task of adding buttons that give users the option to crop to a certain aspect ratio if they want instead of just resizing it themselves (the current options I've included are 9 by 16, 1 by 1, and 16 by 9). To do this, I wrote a function called changeSize that gets passed in the new width and new height of the photo cropper.
Actual Behavior
My buttons work and the aspect ratio successfully changes, but the only problem is that it makes me reupload the image every time I click on a different aspect ratio button. How can I fix this problem? Perhaps by saving the image as a variable?
My code and its preview can be found here for reference: https://codepen.io/duaaz/pen/rNWJKgb