Feature Request: flickr style thumbnail view of images

[PartisanEntity]

It would be great if there could be a choice of various "views" for images/image folders.

A flickr style view for example, showing thumbnails of images.

[enoch85]

I really like this idea.

[etiess]

Hello,

I like it too, but I think it's related to owncloud/core#4022 and then with owncloud-archive/apps#1095

Android app should benefit from that too (see #59 ,owncloud/core#86)

Perhaps we could merge these topics into one single topic?

Thank you!

[etiess]

@davivel, what do you think about merging with #59 ?

[davivel]

Would be great if any Flicker user took the time to explain a bit what's the Flicker style. Thanks.

[etiess]

I think that a simple Gallery view, similar to the standard one of Android, is what @PartisanEntity means. (correct me if I'm wrong). So a gallery with thumbnails (small thumbnails sent by the server), and then, if you click on a picture, a bigger picture is shown, but with a resolution adapted to mobile (in order to increase the download speed and limit the amount of data): this picture is prepared and sent by the server.

So I totally agree with @davivel: the first step is to implement it on the server, which is the task of owncloud/core#86. After that, it will be possible to implement it on client side.

Further improvements can be done after that:

@skomorokh commented in owncloud-archive/apps#1095

Pretty much a required feature for use as a gallery. But sometimes you'll want to zoom in or grab a copy of the full image so it's important to provide a link back to the original.

As for running out of space, perhaps a cache expiration that removes the least recently used ones? You could set a max for the cache and it would prune to that or the remaiing quota, whatever is smaller. And try and free up space from the cache when the quota is hit. Something like that?

Preloading of pictures could be done too, in order to improve the experience and visualize a diaporama faster.

[davivel]

A lot of good ideas a see here, @etiess. Sadly, I can't promise anything about what of them will be feasible in the end. You can be sure we would be very happy if received contributions in this sense.

[etiess]

Unfortunately, I'm not a dev... So I try to help by testing, suggesting and translating. But I understand that it's not a high priority: imo, you're fully right to give priority to stability, quality and performance of file sync.

These additional features will come later, hopefully!

[davivel]

Hey, although not a developer, tests, suggestions and translations are very welcome contributions. So feel free to come over here and comment your impressions or ideas whenever you want.

And the same for everybody around the repo.

[PartisanEntity]

Would be great if any Flicker user took the time to explain a bit what's the Flicker style. Thanks.

This is the flickr workflow on their app:

1. user taps on a folder that contains images
2. flickr opens that folder and displays all images as thumbnails
3. only those thumbnails that fit on the device screen are loaded at a time, so as you scroll down, more thumbnails are loaded
4. tapping on a thumbnail displays the full screen view of that image (swiping left or right in full screen view display the previous or next image)

Attached is an image of what this looks like (image found on the net).

[apramhaas]

+1 for this Idea! Waiting for realization...

[menaceone]

+1 very important feature for finding a picture and share it with friends mobile.

[tobiasKaminsky]

Currently I am working on #317. So this might be related.
As it better fits here, we should discuss:

1. How is this gallery view enabled?

• by threshold
• by user decision
• ...

2. What happens with files that are no images and therefore have no meaningful preview?

• filter them out (only when user can decide to switch to this view)
• display mimetype-icon and filename (could be problematic if filename is too long)
• ...

[jancborchardt]

@tobiasKaminsky

1. At the moment, the gallery view should be enabled by threshold. If there’s more than 80% pictures in the folder, go for gallery view.
2. For non-images: display their file type icon and filename (ellipsize filenames when too long)

That said, having the thumbnails in the normal default list view is more important for now. :)

[tobiasKaminsky]

Current state of the art:

Rotating is working, so the same file will be on the top left position.
Ellipsize is in the middle of the filename.
The number of columns is auto defined: An image is set to 150dp (Nexus 4: 2 columns, Nexus 7 in portrait: 3 columns).

@jancborchardt What do you think?

[enoch85]

@tobiasKaminsky 👍

[jancborchardt]

@tobiasKaminsky can we first have the thumbnails in the normal list view as well? A bigger thumbnail view we can also do, but first we should enhance the current view (as mentioned before). Is that ok? cc @davivel

[tobiasKaminsky]

@jancborchardt This is done in #586. It is currently by purigarcia and then will be merged into develop.
The bigger thumbnail view is, of course, only wise/meaningful when the #586 is implemented.
But as I had a little spare time, I thought I could try the image grid view while waiting to get the other in develop branch.

[jancborchardt]

Ah, ok. Cool then! :)

When the filetype icons are also displayed bigger, you need to supply proper big versions of them. Here are the SVG sources: https://github.com/owncloud/core/tree/master/core/img/filetypes

[tobiasKaminsky]

Is it okay that in both cases (images and other files) none of the icons are displayed:
favorite, downloaded, etc.?
Or should I add them?
What about date for "other files"?

[jancborchardt]

• The badges like favorite and downloaded should definitely be present in this view as well.
• Modified date, and even the filesize, I would say you can leave out of this view for now.

[PartisanEntity]

This is looking great. Thank you for taking the time to work on this. Just wondering, is it possible to make more use of the white space?
Here is how flickr does it currently on their mobile app:

[jancborchardt]

@PartisanEntity good call.

@tobiasKaminsky how about a 3-column view like there? Seems like the best balance of visibility vs usage of space. Also I agree in having it more seamless, with narrower lines between the pictures instead of a lot of whitespace. Also it would be good to fit the pictures to square so they are more easily browsable.

[tobiasKaminsky]

@PartisanEntity @jancborchardt Thank you for your good ideas!
Below you see an updated version.

I will now add the badgets for downloaded and favorite to both views "other files" and "images".
Do you want something else to be changed or enhanced?

Regarding the thumbnails of "other files":
I also could resize the thumbnails to its original size (32x32) and display the other informations (date, etc.) again?
This would have the benefit that we do not need bigger thumbnails... ;)

[jancborchardt]

@tobiasKaminsky yea, that looks great! :)

Do you want something else to be changed or enhanced?

You can remove the size info from the other files.

Regarding the thumbnails of "other files":
I also could resize the thumbnails to its original size (32x32) and display the other informations (date, etc.) again?
This would have the benefit that we do not need bigger thumbnails... ;)

It fits better with the image previews to use proper big filetype icons. ;)

[tobiasKaminsky]

Last update for today:
I know that in the "file view" the favorite icon and the green arrow are swapped.
But in this view I think it is better if both icons are in the lower right corner. As the favorite badget always will be displayed with the downloaded badget (or am I wrong?) it is better to have the green arrow lower than the favorite icon as otherwise there would be a gap.

[etiess]

Great job and reactivity!

IMO, black lines between the pictures would be nicer than white lines.

Concerning the green icon and the star, I would prefer not to see them: a gallery view has to be as sober as possible

For these two ideas, I thinkg that what @PartisanEntity showed with Flickr is perfect. But that's my personal taste ;)

[davivel]

About optimizations regarding to the policy to fetch the thumbnails, I agree with last comment from @tobiasKaminsky : "basic" & stable grid first; optimizations later.

[davivel]

Well, the usual: pull request, priorization, code review & QA.

[tobiasKaminsky]

@davivel I have created a PR: #731
It would be cool to get it in in the next sprint as rebasing could be a little more work.

[davivel]

This is scheduled in the current sprint, as also tagged in the PR #731

[MTRichards]

We need some way to see that the file is downloaded. Can we bring back the green arrow? If not the green arrow, something similar - this information is important for the end user to see.

[tobiasKaminsky]

@MTRichards There is a long discussion in this issue here. And @jancborchardt said that it is not needed as there (soon will) be a thumbnail no matter if the file is downloaded (then it is generated) or not downloaded (then only the thumbnail will be fetched).
As you can see in #239 (comment) I already had the green arrow.

[MTRichards]

Thanks @tobiasKaminsky . By the way, great work here I really like the improvements you have been making to the app. Just wanted to say that to you, sometimes thumbs up gets lost as we focus on the issues.

As for the download state - knowing if a file is local on the device or not is really important - think getting on an airplane to make some changes to a file. Does this change also remove the download arrow from non-images, or just from images?

[tobiasKaminsky]

@MTRichards Thank you for your positive feedback, which I really appreciate :)

You are right, that this is an important information. But please talk to @jancborchardt as he decided to remove this green arrow.
In "grid view" there is no arrow both for images and no images.
Sooner or later there will be a navigation drawer which lets you switch between offline and "all files" view. Would this be sufficient for your case?

[MTRichards]

Lets wait until Jan is back, and then I will discuss with him.
@jancborchardt

[jancborchardt]

As far as I remember we removed the green arrow because the thumbnail showing up was indicator enough. Now that images can have thumbnails regardless if they are on the device or not, we need the indicator back. Sorry for the confusion. :)

[rperezb]

thanks @jancborchardt !
Just to be clear, in the case that a file is downloaded and favorite, both indicators will be shown, at least, for the moment.

[purigarcia]

what about files share by link?
And when there are files downloading inside a folder? In android, there is a yellow arrow when that it's happening
@jancborchardt ?

[jancborchardt]

Everything should behave the same way as in the list view.

[masensio]

@jancborchardt
I've activated the status icons in grid view.
I have two options:

Which of them do you prefer? or Do you have in mind other different option?

[jancborchardt]

Having them all on the right (second solution) is way nicer. :) Otherwise the icons are all over the place. Thanks!

[tobiasKaminsky]

The only problem could be that the chain icon (shared) is hardly visible on dark images.

[enoch85]

Make the icons gray?

[joeplus]

Adding a white-semi transparent overlay on the right or bottom side?

[jancborchardt]

Just give the Sharing icon a white outline, like the star and download icon.

[tobiasKaminsky]

@jancborchardt that is exactly the same I wanted to suggest since ~20 hours, but I was too busy :/

[davivel]

This is finally merged in develop, and will be available soon in the release 1.7.0.

Thanks everybody for the hard work in this feature, including all the ideas and comments, and specially to @tobiasKaminsky for doing most of the programming. This is an awesome contribution.

Please, use new issues for proposals to improve still further the feature. This issue is already long enough.

[jancborchardt]

@tobiasKaminsky rocks! 🚀 🎸 :)