When using Dropzone.js to upload and resize, I would like to also rotate to match EXIF rotation data. Is this possible?
I cant seem to find anything about it on the Dropzone so I assume not?
Searched https://www.dropzonejs.com/ and Google. All solutions seem to be external, which I am not sure how to then integrate with DZ
Dropzone.options.myAwesomeDropzone = {
resizeWidth: 1920,
resizeHeight: 1080,
resizeMethod: "contain",
resizeQuality: 1.0,
paramName: "file",
maxFilesize: 10,
acceptedFiles: ".jpeg,.jpg",
createImageThumbnails: true,
All uploaded (and resized files), to be hard code rotated.
If you are using the latest Dropzone (tested with 5.4.0), it will automatically fix the orientation for thumbnails, as long as you include the exif.js library in your page:
https://github.com/exif-js/exif-js
It's from this answer. Hope that will help you.
More information: With Dropzone 5.7.2 I suddenly find you don't need to include the exif-js library. Removing that and all works well and rotation is automatic. Also I'm just testing with 5.9.2 and that autorotates also.
Here's a patched version of Dropzone that should handle the EXIF orientation correctly: https://www.npmjs.com/package/dropzone-exif-fix
Credit for the patch goes to Kaymes on GitHub (https://github.com/dropzone/dropzone/pull/2001)
There is a bug with dropzone, where if you are using resizeWidth/resizeHeight, and then uploading a large file with EXIF rotation data, the resize operation applies the EXIF information, but then the EXIF data is restored to the image.
There is a pull request to fix the issue, however this hasn't been merged in, and this issue exists still today in both latest stable (v5.9.3) and beta versions (v6.0.0-beta.2). Someone has released a patched version of 5.9.3 with this fix applied here:
https://www.npmjs.com/package/dropzone-exif-fix
If you use that patched version, uploads should work with EXIF data maintained. On your server you can then apply the orientation and strip the EXIF data before using the image further, or alternatively, you can leave the browser to handle using the image-orientation css property.
Related
I am using Umbraco 7.5.3 and want to use .gif images in Media.
I can easily upload the images but Umbraco is unable to show any thumbnail for that image in the backoffice and also it is not getting rendered on the page as well.
Any clue?
Thanks
It was happening as it was a bug with ImageProcessor -v 2.4.4 and I was using this same version.
This bug got fixed in 2.4.5. If any of you have encountered the same problem, then it might help you.
Here is the reference
Thanks
I cannot view the images from boost.org documentation.
For example,
http://www.boost.org/doc/libs/1_58_0/libs/math/doc/html/math_toolkit/dist_ref/dists/hyperexponential_dist.html
Looking at the source code and clicking the image links, I get "Error 404: File not found".
Apparently my professor can view the images no problem, but my classmates and I cannot. Does anyone know why I can't view any of the images on the boost.org documentation website? Thanks.
The older 1.57.0 version is ok.
They changed their image format from PNG to SVG in v1.58.0, but these are not available on the site (the offline version contains the SVG files).
If I upload an image with a suffix .JPG the thumbnail will not display in the browse images area. I can select it and place it just fine, but the thumbnail will not display. If I change the suffix to lowercase .jpg on the server, the thumbnail will display. Is this a bug or something that can be fixed in the config? Using the ColdFusion connectors.
It's a bug caused by misfortunate behaviour of ColdFusion described here: Problems determining a file's mime type in ColdFusion. Download version 2.5.0.1 (released a minute ago ;)) and the thumbnails should be working.
We have encountered multiple corrupted Instagram Standard Images (612px).
This happens the last 3-4 days. And across multiple Instagram users.
Strangely this issue is only evident when the images are opened using Adobe Photoshop.
When viewed using Mac's finder or Preview this image corrupt problem is not visible.
It affects about 50% of our customers. And mostly about 10-20% of their choosen images. And some can affect around 50-100% of their images.
Example of corrupted images:
http://distilleryimage10.s3.amazonaws.com/5875aa2eb24411e3bfe2124c49cf34ce_8.jpg
http://distilleryimage0.s3.amazonaws.com/3b3452a8b24411e3b352126f9f588c64_8.jpg
Again, this issue is only evident when the photos are being prepared to print.
Or when it is opened using Adobe Photoshop/Acrobat/Illustrator/Indesign.
Please help.
Thanks
Jeff
I managed to solve my issue with the same description. What I first did was download the images to my webserver exactly to what is was online, so I didn't change anything of the file contents, just get en then put in the file.
How I solved my problem? I use PHP to generate the image now after I donwloaded it the same way. This is the simplified version of my script:
<?php
// Create an image instance
$im = imagecreatefromjpeg('instagram_image.jpeg');
// Disable interlacing
imageinterlace($im, false); // did not use this but will do the same
// Save the image
imagejpeg($im, 'instagram_image.jpeg');
imagedestroy($im);
?>
When I started using this simple create and save script it all worked again. It looks like it does nothing but it did a lot for me! Hope it helps someone saving a lot of time, took me 1,5 day to figure out the exact problem.
using Fine-uploader V 3.5 Uploading images successful.
I am displaying the thumbnails of the uploaded images, but how can I delete the thumbnail displays when I delete the file itself?
Is there an unappend I can perform with the onDeleteComplete callback?
I would think it might be easier to attach it to the right of the file name/size/delete link or immediately below it. Then when the list item is removed, the image is also.
Since Fine Uploader does not yet have the ability to create previews yet (it will soon, see cases #868 and #869) I'm assuming you are adding these previews yourself.
So, you simply need to make use of the onDeleteComplete callback. When this callback is invoked, simply remove the associated preview from your document.