Rails 6 upload wdget saves before applying crop
The following code is used in my rails 6.1 application to upload images via the widget. The upload works fine . After cropping the image, either clicking 'crop' or 'save' uploads the original image instead of the crop.
<script src="https://upload-widget.cloudinary.com/global/all.js" type="text/javascript"></script>
<script type="text/javascript">
var myWidget = cloudinary.createUploadWidget({
cloudName: '<cloudname>',
upload_preset: '<%= cloudinary_preset %>',
sources: [
"local",
"camera"
],
cropping: true,
styles: {
palette: {
window: "#FFFFFF",
windowBorder: "#90A0B3",
tabIcon: "#1891F7",
menuIcons: "#5A616A",
textDark: "#0F2E51",
textLight: "#FFFFFF",
link: "#1891F7",
action: "#FF620C",
inactiveTabIcon: "#3F5A81",
error: "#F55A68",
inProgress: "#0078FF",
complete: "#34D09B",
sourceBg: "#e0e4f5"
},
fonts: {
default: null,
"'Poppins', sans-serif": {
url: "https://fonts.googleapis.com/css?family=Poppins",
active: true
}
}
}
}, (error, result) => {
if (result.event == "success") {
fetch('/graphics', {
method: 'POST',
credentials: "same-origin",
headers: {
"X-CSRF-Token": <x-csrf-token>,
"Content-Type": "application/json"
},
body: JSON.stringify({
graphics: {
graphicable_id: <%= graphic.id %>,
graphicable_type: "<%= graphic.class.name %>",
stored_at: result.info['public_id'],
label: result.info['original_filename']
}
})
}).then(response => response.text())
.then((response) => {
console.log(response)
eval(response);
})
.catch((error) => console.log(error)
)
}
})
document.querySelector(".image-upload-button").addEventListener("click", function () {
console.log('image upload requested');
myWidget.open();
}, false);
Comments
-
The upload preset soley sets the folder. In the Cloudinary library I see the full image, not the crop. I can upload a screencast showing what I'm seeing?
0
