moxiecode / plupload

Plupload is JavaScript API for building file uploaders. It supports multiple file selection, file filtering, chunked upload, client side image downsizing and when necessary can fallback to alternative runtimes, like Flash and Silverlight.
http://www.plupload.com
GNU Affero General Public License v3.0
5.63k stars 1.43k forks source link

Resize and crop upscale? #1017

Closed precisionpete closed 7 years ago

precisionpete commented 10 years ago

I'm very happy to have found plupload. This will save me tons of time. I've already spent a couple of days trying to roll my own.

I am anxiously looking forward to your adding bicubic scaling. That will improve the quality substantially.

While you are in there... Do you think you could add the option to resize and crop on upscale? It seems only to crop when the image size is reduced.

I would like it to generate uniform thumbnails that are always the same aspect ratio. e.g. always a square. From what I have seen, it only resizes down... And crop only works when resizing?

i.e. If I ask it to resize and crop to 200x200, and I upload an image 100x150, it seems to leave it at the original size. I would like an option to upscale and crop to 200x200 in all cases. If not possible, the next best thing would be to at least maintain the crop aspect ratio - i.e. 100x100.

Thanks for a great tool! Peter

jayarjo commented 10 years ago

Originally the whole thing was introduced to save the bandwidth, then we've added a crop. Server still can do much better for any other more advanced usage cases. Even bicubic done on client-side takes some additional time in comparison with server and is not exactly faultless. So we are kinda on crossroads for this feature right now.

Why do you think it might be useful for example?

precisionpete commented 10 years ago

Not looking for a Photoshop alternative. Purely a convenience feature. Bandwidth is of course the primary concern.

Thumbnails are my main concern. You don't want a guy with a phone uploading an 8Mb thumbnail. So for this, the resize has to happen on the user device. But on a large resize, the image quality is terrible. I understand that bicubic takes some horsepower. But going down to a small size, I assume would keep that minimal. To the user it would just seem like a slightly longer upload?

For the resize... Again with thumbnails, you want them all a uniform aspect ratio. So as long as you are resampling the image, might as well crop it.

In terms of the upsample... same argument. You want them all a uniform aspect ratio. Since the downsample is able to crop them to an aspect ratio, the smaller images need to be processed accordingly. I don't really need them to be upsampled. But cropping them to a consistent aspect ratio would be very desirable for consistency. Display size can be dealt with by CSS.

It still makes sense to do the crop here. You have a handle on the image already. A crop would not take any horsepower.

One other thing I would like to implement but can't figure out how is to update the new image on the page rather than having to pull it from the server again. HTML5 could do it. But I can't figure it out with plupload. Ideally in the BeforeUpload I could get a handle to the new resized image and update an image tag on the page with the new data. Maybe you can do that already? I just can't figure out how...

Could I use a similar hook and maybe do the crop myself before uploading? Maybe that would be a good way to deal with exceptional use cases like this?

In my specific case, I don't need a preview before uploading. I'm using one button with an instant upload. I just want to update the page without having to reload. I tried refreshing the URL with javascript but that doesn't always work due to timing and caching.

I agree with your concern to keep it simple here. It really is a great toolkit already. If I have to do any heavy lifting, I of course can do it on the server. But with a tiny bit more on the client, I can avoid all of that. The thumbnail resize quality really needs to be improved otherwise I can't get good data to the server. But the other things are pretty easy I would think if you already have a handle on the image.

Thanks again Peter

Peter Carroll, Bluefriday Inc. peter.carroll@bluefriday.ca

On Mon, Feb 3, 2014 at 3:11 AM, Davit Barbakadze notifications@github.comwrote:

Originally the whole thing was introduced to save the bandwidth, then we've added a crop. Server still can do much better for any other more advanced usage cases. Even bicubic done on client-side takes some additional time in comparison with server and is not exactly faultless. So we are kinda on crossroads for this feature right now.

Why do you think it might be useful for example?

— Reply to this email directly or view it on GitHubhttps://github.com/moxiecode/plupload/issues/1017#issuecomment-33931030 .

jayarjo commented 10 years ago

This thread might be of some help: https://github.com/moxiecode/plupload/issues/1005 (do not miss a fiddle example over there). Plupload doesn't have an access to those images but it's underlying core - mOxie can. Be sure to check the API here: https://github.com/moxiecode/moxie/wiki/Image.

jayarjo commented 10 years ago

It is more likely that we will implement bilinear and bicubic resampling in 2.2, rather than not. And then we probably can do a viable upsampling as well. I guess people expect it anyway, even if it won't be used that frequently.

precisionpete commented 10 years ago

Any chance of making the crop operate on smaller images? It should somehow produce consistent results regardless of image size passed in. Hopefully that's pretty easy...

Thanks again Peter

Peter Carroll, Bluefriday Inc. peter.carroll@bluefriday.ca

On Mon, Feb 3, 2014 at 10:17 AM, Davit Barbakadze notifications@github.comwrote:

It is more likely that we will implement bilinear and bicubic resampling in 2.2, rather than not. And then we probably can do a viable upsampling as well. I guess people expect it anyway, even if it won't be used that frequently.

— Reply to this email directly or view it on GitHubhttps://github.com/moxiecode/plupload/issues/1017#issuecomment-33964044 .

mix3d commented 9 years ago

Plus one more for upscale; My scenario is downscaling+crop to 256x256, but if the uploaded image has a dimension smaller, it does not get scaled up to that square size. This is a considerable gap, and for now we will have to just check the onFileAdded for the dimensions and cancel the upload if the file is too small. Not an ideal UX at all.

jayarjo commented 9 years ago

I'm refactoring image resizing now. Cannot promise that will implement this one, but I will bear it in my mind.

mix3d commented 9 years ago

I found a different platform, FileAPI, that DOES resize upwards. It's poorly documented, with several niggles I had to edit manually, but it works, so I will be using it in the meantime. Cheers! http://mailru.github.io/FileAPI/

jayarjo commented 7 years ago

This has been implemented in 2.3.1 (although now we get requests to remove upscale).