[Placeholder] - Add support for display of image thumbnails/previews (pre-upload)

[hiulit]

Hi there!

I'm using this great plugin and it's working wonderful for me!
I've tweaked it a little to fit my project but I can't get it to show thumbnails (and store them on the server would be even better) so users can see what they just uploaded.

Thanks in advance!

[rnicholus]

Doable, but not in the 2.x branch. This will likely be part of 3.x..

[cdvrooman]

I was just trying the "Display Image Thumbnails" demo and I did the following:

1. Uploaded a test image, the thumbnail was displayed as expected.
2. Uploaded two additional, different test images; however, the thumbnail from the first image appeared two more times.

For whatever reason, the thumbnail mechanism is not detecting the latest uploaded image and is reusing the first image.

The demos are still pretty cool!

[rnicholus]

@cdvrooman Please show your code. If you are simply using the "thumbnail" demo as-is, you can see, looking at the code, that this is not capable of showing the thumbnail of an actual dropped/uploaded image. The demo is meant to simply highlight the possibility. You will need to write your own code to display the thumbnail of a dropped/selected image file. The File API along with the createObjectURL function are both a necessity to make this happen.

[abennouna]

I am not sure I'm following but provided you return the filename (ie the
response JSON in the case of PHP), you can use the demo as is and use the
server upload path + returned filename

[rnicholus]

Ah yes, if you know the path of the uploaded file, you can display a thumbnail in the browser by following the advice from @tellibus. My comment discussed how you can display a thumbnail before the file has even been uploaded. The latter is something I plan on adding to FU in the near future. The former could be a fallback, for browsers that don't support the File API.

[lmaurer]

Need to break this up into separate stories:

• Rethink templating - 13 - Redesign templating for Fine Uploader UI #867
• FineUploader mode UI for browsers w/ File API support - 13 - File API Browsers - Add support for display of image thumbnails/previews (pre-upload) #868
• FineUploader mode UI for Non-file API support - 5 - Non File API Browsers - Add support for display of image thumbnails/previews (post-upload) #869

[rnicholus]

Closed as this has now been split up into 3 separate cases.