blueimp / jQuery-File-Upload

File Upload widget with multiple file selection, drag&drop support, progress bar, validation and preview images, audio and video for jQuery. Supports cross-domain, chunked and resumable file uploads. Works with any server-side platform (Google App Engine, PHP, Python, Ruby on Rails, Java, etc.) that supports standard HTML form file uploads.
https://blueimp.github.io/jQuery-File-Upload/
MIT License
30.94k stars 7.95k forks source link

Panoramic Images Incorrectly Resized on iOS #3081

Open seanabrahams opened 10 years ago

seanabrahams commented 10 years ago

When uploading (with jQuery File Upload resizing and previewing) a panoramic photo taken from iOS 7.1 it is resized incorrectly on mobile Safari and Chrome. The left half of the image contains the image data squished to fit while the right half of the image is blank.

Here's the admittedly hard to see behavior using the demo page: panoramic-image-resize-bug

The top image is a panoramic image while the bottom is not. Notice the top image only takes up half the width of the bottom image.

Once uploaded the right side of the image becomes black:

panoramic-fail

This behavior is not exhibited if you upload the same photo on desktop Safari or Chrome. It only occurs on mobile Safari and Chrome.

Tested with iPhone 4S, iOS 7.1, Safari and Chrome.

blueimp commented 10 years ago

First, thanks for the detailed bug report.

The resize library used by jQuery File Upload is the Load Image library, which already includes patches for the scaling behaviour of iOS: https://github.com/blueimp/JavaScript-Load-Image/blob/master/js/load-image-ios.js

So this behaviour will probably be reproducible with the Load Image library itself. Might be possible to write another patch.