[buddypress-trac] [BuddyPress Trac] #4859: Avatar Cropper Small Screens - Image Size Too Large on mobile devices

[buddypress-trac]

#4859: Avatar Cropper Small Screens - Image Size Too Large on mobile devices
-------------------------------------+-----------------------------
 Reporter:  modemlooper              |       Owner:
     Type:  enhancement              |      Status:  new
 Priority:  normal                   |   Milestone:  Future Release
Component:  Core                     |     Version:  1.2
 Severity:  normal                   |  Resolution:
 Keywords:  has-patch needs-testing  |
-------------------------------------+-----------------------------

Comment (by terraling):

 I see there are a few tickets around improving avatar uploading and
 cropping, and I'm commenting on this one because it's specifically about
 the experience on mobile.

 A few observations:

 1. jcrop "works" on mobile but I find is barely usable, the handles are
 too small etc., and a pinch-zoom approach would be better.
 2. no rotate -- my users are using their phones to take a snapshot for
 their avatar which when uploaded is often sideways-on or upside-down with
 no means to fix other than start-over and use a photo-app first.
 3. elsewhere ([https://buddypress.trac.wordpress.org/ticket/5146]) it has
 been suggested 'streamlining' the upload by removing the requirement to
 press an upload button and have it be triggered on changing the file
 select field and doing the cropping on the server etc.

 This is the opposite of what should be happening. Many more users access
 sites with mobile (duh) and a modern approach that caters for them should
 look something like:

 -- User selects a photo to upload. If on mobile this may well be a 5Mb
 image for a 150px avatar. So,
 -- User can crop AND rotate photo as required
 -- This is done IN THE CLIENT using canvas so that the image can be
 resized BEFORE uploading (esp. via a mobile data plan). Less bandwidth, &
 less server storage.
 -- As a fallback for non canvas-capable browsers and for re-editing
 existing images (crop/rotate) options should be available via the server.

 There is quite a lot of work to be done here and I have to do it for my
 own site, and I'm currently investigating alternatives to jcrop etc., and
 I just wanted to put a marker down to say that I'm working on it and will
 let you know how I get on.

 I already have the front-end image cropping/rotating canvas stuff working
 on desktop (for uploading images in front-end forms for another area of my
 site, haven't changed the avatar uploads yet), though the library I used
 for cropping is even worse than jcrop on mobile.

 I'll keep you posted.

--
Ticket URL: <https://buddypress.trac.wordpress.org/ticket/4859#comment:9>
BuddyPress Trac <http://buddypress.org/>
BuddyPress Trac