Enhance image select modal

[AmibeWebsites]

Two suggestion to enhance the user experience of selecting an image (for example, when adding an image to a menu item in the Menu Editor):

1. Being able to search images and/or reorder the list by file name, date added and size
2. Being able to move up and down the list using the keyboard up/down/pageup/pagedown arrorws

[AmibeWebsites]

Make it three suggestions...

1. Being able to search images and/or reorder the list by file name, date added and size
2. Being able to move up and down the list using the keyboard up/down/pageup/pagedown arrorws
3. Only displaying the thumbnails of images and being able to select the size once the image is selected - this would substantially reduce long lists of images and also increase the load speed of this modal.

[AmibeWebsites]

The more I think about this one, why don't you simply use the existing Media Library that Wordpress provided rather than duplicating functionality?

[JoomFX]

@dudewithamood The main reason, I guess, is because G5 is a platform independent framework that works on Joomla, Wordpress and soon on Grav. Therefore, most of the functionality needs to come from G5 instead of the platform.

[w00fz]

There are several reasons as of why we created our own Media picker.

1. Platforms Media pickers have always been incredibly hard to integrate in third party extensions. This comes from experience. I've dealt with them with RokGallery and RokSprocket, it's always been a constant challenge and further more, it has always been very limiting in what we could use out of them.

2. Gantry uses streams and there is no platform (aside for Grav for obvious reasons) that is capable of handling streams in the way we do.

   Our Media picker handles cascading folders and file overrides, meaning that the flat folders and files list you see in the picker, is a combination of different paths merged together, as a Stream does. It is more complex than it looks like.

   Every time you upload a file that already exist, the file gets copied under your custom/ folder with the same platform structure you have chosen, but you always only see one file in the picker. When you delete it, you are barely deleting your override and the original file is kept intact.

3. As mentioned above by Ivo, it allows for very easy maintenance since it's the same for all platforms. Fix in one place, it applies to all.

There is no such platform that allows us any of these advanced stuff. Although it might look like the media picker is simpler than others, it does its job very well, it's quick and very advanced. Our goal with Gantry and every aspect of it, was to keep things simple.

When I evaluated the Media picker and I needed to start, I decided the only things I wanted to keep it simple were:

1. being able to pick up a file from a folder
2. being able to see the thumbnail if it was an image (preview was only added later)
3. being able to filter at a definition level (blueprints)
4. being able to upload a file as easy as possible (drag and drop from desktop)
5. being able to finally select a file

Everything else was unnecessary or superfluous.

Note: Sorting and filtering has been in my list of things to do for a while (as a very low priority), so stay tuned.

[hennysmafter]

From mr910: Would be awesome to have the ability to sort items in the 'File Picker' by filename, size, and date.

From me: Would be cool to add a full URL as well.

[w00fz]

This was already referenced by the way 😄 , can see above your comment.

[AmibeWebsites]

@w00fz Thank you for this detailed explanation - it's very helpful for those of us not directly involved. I greatly appreciate where you and the rest of the team are going with this.

Aside from search and ordering to facilitate quick selection, two additional challenges I face on sites are:

1. Some sites have hundreds of images - some very large owing to the nature of the sites. Since I'm on Wordpress, each of these images has up to four versions based on resizing. So worst case scenario is that when the image picker loads it lists four times the number of images I have. Additionally it seems to load the entire image rather than a thumbnail. I think the ramifications are obvious. Ideally, just the thumbnails would load (with some form of paging) and one could then select which size to use.
2. I get confused having two different locations for images, especially if an image is uploaded using the picker and I can't find it under the Media Manager. Personally I'd remove this option from the picker (unless the uploaded files are uploaded in a way that can then be managed by the Media Manager).