Opened 11 years ago
Closed 10 years ago
#24716 closed task (blessed) (fixed)
Grid view for the Media Library
Reported by: | alexvorn2 | Owned by: | |
---|---|---|---|
Milestone: | 4.0 | Priority: | normal |
Severity: | normal | Version: | |
Component: | Media | Keywords: | |
Focuses: | ui, javascript, administration | Cc: |
Description
Currently we have a list of images and additional information to them on the right, It can be cool to use all this space for displaying other images and hovering on a image can show some information (size, date of upload ...)
This will help to display more attachments on the page.
Attachments (69)
Change History (217)
#3
@
11 years ago
I attached a few wireframes outline three different views: list, hybrid, and grid.
The list view is similar to the existing view. It occurs to me that this view may be better suited for bulk management, and viewing/sorting by details. It could use some tweaks, but the layout is otherwise good.
The hybrid view aims to show larger thumbnails, but still maintain room for all the details about the attachments.
The grid view is great for browsing, but doesn't lend it self to showing as much information.
It may be cool to offer a way to create a new post/page with the selected image, or a gallery of the selected images.
#4
@
11 years ago
I like it...
Grid View:
- maybe to display more then 3 columns, depending of the size of the screen
- smaller thumbnails for more space
- can be used for "Manage Themes" page
#5
follow-up:
↓ 6
@
11 years ago
It would be a dream having a grid view of media library.
I think this ticket should get an higher priority; many years passed, many things changed, and media library should be changes too. The list view is too hard to manage when files number increase.
Please update as soon as possible.
#6
in reply to:
↑ 5
@
11 years ago
Replying to virgodesign:
It would be a dream having a grid view of media library.
I think this ticket should get an higher priority; many years passed, many things changed, and media library should be changes too. The list view is too hard to manage when files number increase.
Please update as soon as possible.
We need someone to make a plugin first, then after that it can be considered for a review to join WP Core, so until that it remains as an idea.
The themes page changed from the date I started this ticked, so the display view can be imported from there... but not as big thumbnails as there, and instead of Theme Details to use Image Details. Activate, Live Preview to Edit, Delete, View...
#7
@
11 years ago
I made a plugin. There wasn't a huge interest from developers, so the project has been on hold. I'd love to jump back into this for maybe 4.0.
#8
@
11 years ago
That plugin: http://wordpress.org/plugins/media-grid/
#9
@
11 years ago
I put it on GitHub to try to drum up extra interest, there's been a little: https://github.com/helenhousandi/wp-media-grid-view/
#10
@
11 years ago
So this will be in 4.0? We can apply the milestone number to it so it will take more attention.
#11
@
11 years ago
The plugin is not at a stage to determine an absolute yes/no for 4.0. Features as plugins are to decouple feature development from release cycles.
This ticket was mentioned in IRC in #wordpress-ui by ericandrewlewis. View the logs.
10 years ago
#14
@
10 years ago
- create a new media workflow "Manage," which powers the media grid.
- hide the bottom toolbar and the tab links (router) from this workflow by default.
- window-wide drag-and-drop uploader in the media grid view.
- add URL and human-readable filesize to the attachment details view (parity with fields shown in a list-view Edit Media page).
- add a global mode toggle for Media, between grid view and the list view.
#15
@
10 years ago
- Focuses javascript administration added
- Keywords has-patch needs-testing ui-feedback ux-feedback added
- Milestone changed from Awaiting Review to 4.0
24716.2.diff will apply cleanly. I also fixed some localhost cruft and avoided some JS errors on certain screens.
Only big issue I have noticed: if you upload a file and it fails, there are no errors shown.
Other than that, this rocks.
This ticket was mentioned in IRC in #wordpress-dev by ericandrewlewis. View the logs.
10 years ago
#18
@
10 years ago
- Summary changed from Add a grid view for media files in Media Library to Grid view for the Media Library
- Surface author and "Uploaded To" info in the attachment details view.
- Media mode (list vs. grid) is now a persistent user option, defaulting to grid.
- Add a mime-type dropdown filter.
#19
@
10 years ago
- Up
.media-grid-view-switch
z-index to300
, to out-stack.media-frame-title
. Fixes @helen's bug findings in comment:16.
#20
@
10 years ago
- Remove router instantiation bloat that isn't used by
MediaFrame.Manage
- Fix uploader issue @wonderboymusic brought up in comment:15
There are now no standing issues with this patch. Please futz, test, and provide feedback.
This ticket was mentioned in IRC in #wordpress-dev by helen. View the logs.
10 years ago
#23
@
10 years ago
Notes thus far from me, please everybody test and also make notes:
Parity with the list table view
- Needs link to post.php (edit screen), possibly in the sidebar when selected, between "Edit image" (when there) and "Delete Permanently". Open to suggestions.
- Needs date filter.
- Need to discuss whether we need to also have parity with sorting by various columns, filtering by author/uploader (semi-hidden), attached unattached items, and comment count.
- Bulk edit (currently just delete). Perhaps a switch into a distinct multiple select mode, e.g. the way iOS handles it.
- Expose "Add new" workflow - drag-anywhere-to-upload is not visible, and not universally accessible. Probably just showing the uploader as in the modal.
Other
- Select first item when loading the screen.
- Don't need to show checkbox for a selected item in this view.
- Show "No results" rather than (or in addition to?) uploader when filtered to no items.
- What does an empty library look like?
Related
This ticket was mentioned in IRC in #wordpress-dev by ericandrewlewis. View the logs.
10 years ago
#29
@
10 years ago
[28682] broke inserting images from Media Library via the media modal on my install:
<br /> <b>Warning</b>: filesize() [<a href='function.filesize'>function.filesize</a>]: stat failed for H:\home\wordpress\trunk/wp-content/uploads/2008/06/2429111678_2ecb3abb93_b.jpg in <b>S:\home\wordpress\trunk\wp-includes\media.php</b> on line <b>2604</b><br /> <br /> <b>Warning</b>: filesize() [<a href='function.filesize'>function.filesize</a>]: stat failed for H:\home\wordpress\trunk/wp-content/uploads/2008/02/catyeye.jpg in <b>S:\home\wordpress\trunk\wp-includes\media.php</b> on line <b>2604</b><br />
We don't store absolute file paths in _wp_attached_file
since [8796], but I have a couple of files uploaded before 2.7, and now they have an invalid path, which apparently should be fixed on editing by wp_insert_attachment().
On a related note, get_attached_file()
can return false since [20613], but we don't check for that here.
Looks like we need a file_exists()
check before calling filesize()
: 24716.3.patch.
However, that causes 'false'
string to be displayed as a file size: 24716.filesize.png. The screenshot also shows an overlapping issue with Hello Dolly activated.
#30
@
10 years ago
Noticed that r28682 caused a visual issue with the image details modal due to
-.image-details .embed-media-settings .setting span { +.image-details .embed-media-settings .setting .name {
Looking at the reset of the changeset, I think that this should be changed back to span
.
#31
@
10 years ago
24716.6.diff makes the change.
#32
@
10 years ago
Can I propose that (trashed)
or similar be added to the Uploaded To
label in the sidebar if an item is trashed?
For example, I clicked on this image: http://screencloud.net/v/iNFa
It shows as being uploaded to the "Catalyst Framework" but doesn't given any indication that the "Catalyst Framework" item has been deleted until I click on it: http://screencloud.net/v/odYD
#33
follow-up:
↓ 90
@
10 years ago
Looks like we also didn't account for admin notices at the top of the grid view, as seen in admin_notices.png above.
This ticket was mentioned in IRC in #wordpress-dev by ericandrewlewis. View the logs.
10 years ago
This ticket was mentioned in IRC in #wordpress-dev by ericandrewlewis. View the logs.
10 years ago
#37
@
10 years ago
attachment:24716.7.diff is a first step towards Media Grid revisions outlined on make/UI.
- Introduce a
.hide-sidebar
class tomedia.view.AttachmentsBrowser
. The media grid will no longer have a persistent sidebar, so the browser toolbar and attachments list will take up full width. This is set via by passingsidebar: false
in the options hash when instantiatingmedia.view.AttachmentsBrowser
. Defaults totrue
, which the modal view uses. - Introduce on-hover text "Edit Media" in the template for
media.view.Attachment
, borrowing css from the Theme browser's.more-details
element. - In media.view.Attachment.render(), bring the view's initial
options
hash through to theoptions
hash passed to the templating function, so that we have access to the view'scontroller
(i.e. frame) within the microtemplate. This comes in handy for inspecting the controller's current "mode," more on that in a minute. - In
media.view.MediaFrame
(and by extension its descendants, all frames), introduce amode
property as an array, which will persist states. For now, this includesselect
/edit
andgrid
. This helps in microtemplates when deciding within an attachment view whether to display UI which is specific to the grid (i.e. fields to show below each Media item). By default the media grid will be inedit
mode, and Bulk Edit mode will use theselect
mode. - Introduce
showAttachmentFields
as an option formedia.view.AttachmentsBrowser
. This will eventually be a persistent user-specific setting which dictates which fields to display underneath a media item's thumbnail in the grid. Trickles down tomedia.view.Attachments
and finallymedia.view.Attachment
. Utilizecontroller.options.mode
in themedia.view.Attachment
's microtemplate to decide whether or not to show the fields.
UPDATE: This is not ready for commit, just a bookmark and share functional decisions.
#38
@
10 years ago
24716.8.diff fixes the display somewhat and accounts for fields
This ticket was mentioned in IRC in #wordpress-dev by ericandrewlewis. View the logs.
10 years ago
#40
@
10 years ago
attachment:24716.9.diff is still a work in progress, and should not be considered for commit, only for feedback.
Brief notes: If you click on a media item in the grid, a modal will open up with the Image Editing (read: cropping) interface - no default media details editing interface yet.
Hard notes:
- Introduce
media.view.Frame.EditMediaDetails
, which is a view that will control editing media details. Note this extends frommedia.view.Frame
, notmedia.view.MediaFrame
.media.view.MediaFrame
is hard-wired to work with specific regions (menu, title, toolbar, content, router), while our mock-ups don't match that exactly. We need a custom header for the pagination links (click left to edit the previous media item, right for next). So what we want is region management and a state machine, which is exactly whatmedia.view.Frame
provides. - Introduce
media.controller._State
, which is a more abstracted state controller object.media.controller.State
is hard-wired to the regions defined bymedia.view.MediaFrame
, while the only region we need inmedia.view.Frame.EditMediaDetails
iscontent
. media.controller.EditImageNoFrame
is the state for editing an image (i.e. the cropping interface), a simplified version ofmedia.controller.EditImage
without thetoolbar
region setup, which we will not need.- Something I'm happy with: in
media.view.Attachment
, trigger an event on the frame controlleredit:attachment
, instead of creating the modal from within the view, the controller does on an event callback. We should continue to decouple components via the event API as much as possible.
#41
@
10 years ago
- Keywords dev-feedback added; has-patch needs-testing ui-feedback ux-feedback removed
#42
@
10 years ago
attachment:24716.10.diff is still a work in progress, and should not be considered for commit, only for feedback.
Brief notes: Moved the library view switcher from the upper right corner of the screen into the browser toolbar.
Hard notes:
- Straight up copying CSS from theme experience for the navigation bar. We should move towards an OOCSS UI toolkit for wp-admin, and make available a class like
.wp-nav-bar
here instead. - Creating a
libraryViewSwitcher
view inside ofmedia.view.AttachmentsBrowser
. This is a bit awkward - we're putting a media grid-specific thing inside theAttachmentsBrowser
view. Open to suggestion here. I think it's a good use-case for a Javascript action hook (oh no he di'in't!), so the frame controller could tag in here with a callback and register the view on the toolbar, providing a clear separation of concerns.
Beginning to drop notes in inline code comments where things get weird.
#43
@
10 years ago
attachment:24716.11.diff is still a work in progress, and should not be considered for commit, only for feedback.
Brief notes: Edit attachment modal now has tabs, defaulting to the edit attachment details tab. Only shows tabs if the attachment is an image, as the second tab is for "Edit Image"
Hard notes:
- Renamed
media.view.Frame.EditMediaDetails
tomedia.view.Frame.EditAttachment
, fits in better with the vocabulary used elsewhere in media. - Added a
router
to this frame. - Introduce
media.view.Attachment.Details.TwoColumn
, which is essentiallymedia.view.Attachment.Details
(what you see in the right sidebar when editing a media item in the regular media modal) but with a different microtemplate. Oddity here:media.view.Attachment.Details
inherits frommedia.view.Attachment
.media.view.Attachment
sets up our data binding, but also presupposes a frame that will have aselection
property, assuming we're selecting attachments. Gavemedia.view.Attachment.Details.TwoColumn
a custominitialize
method which is a copy ofmedia.view.Attachment.Details.initialize
while ripping out the part aboutselection
.
#44
follow-up:
↓ 48
@
10 years ago
- Keywords has-patch added
If a media file does not exist, filesize() can break the JSON output with a PHP warning when debug display is turned on. See 24716.13.diff.
#45
@
10 years ago
- Keywords has-patch removed
attachment:24716.12.diff is still a work in progress, and should not be considered for commit, only for feedback.
Brief notes: Pagination now works in the Edit Media Item modal. Basic styles have been applied. Things work, albeit a bit rough around the edges.
Hard notes:
- Copy a lot of styles from the theme browser for admin UI visual parity. These should move into common selectors for separate modules to share.
- Pagination works by bubbling up an
edit:attachment:previous
andedit:attachment:next
event from the EditAttachment frame to the Manage frame. An EditAttachment frame is bound to editing one attachment, it closes and then a new one is immediately instantiated by the Manage frame.hasPrevious
andhasNext
options are passed in the hash when instantiating an EditAttachment frame. Architecture inspired by the theme browser here, I'm into it.
This ticket was mentioned in IRC in #wordpress-dev by ericandrewlewis. View the logs.
10 years ago
#48
in reply to:
↑ 44
@
10 years ago
Replying to kovshenin:
If a media file does not exist, filesize() can break the JSON output with a PHP warning when debug display is turned on. See 24716.13.diff.
See comment:29 :)
This ticket was mentioned in IRC in #wordpress-dev by helen. View the logs.
10 years ago
#51
@
10 years ago
- Keywords has-patch needs-refresh added
24716.14.diff does:
- Moves the grid-specific code to
media-grid.js
- easier to consume the churn, versus playing Where's Waldo with 7000 lines ofmedia-views.js
- Fixes some of the CSS in the modal popup for Edit Metadata pane. I think this part is actually fairly presentable now. Edit Image still needs love.
- For audio and video files that have a thumbnail, shows it behind the audio or video icon - this may need some massaging, but makes it easier to identify tracks.
I am going to work on inline previews of audio and video.
#52
@
10 years ago
Note: we should try to get the Backbone sync working in this modal state with the same ID3 data we have on the Edit Media full-page screen. The data is already available in the response from wp_prepare_attachment_for_js()
#53
@
10 years ago
24716.15.diff allows you to listen to your audio files and watch your videos right in the grid. I borrowed the toolbar styles from the MCE views.
This is still a work in progress, but it's pretty slick. I can't figure out how to trigger the modal to open when the Edit icon is clicked. I will save that for E.A.L. to rabbit-hole.
#56
@
10 years ago
- Keywords needs-patch added; dev-feedback has-patch needs-refresh removed
Some known deficiencies:
- Styling.
- Responsive / touch considerations.
- Keyboard accessibility.
- Add New link - note that drag and drop to the area works, but is not enough for the two bullet points above.
- No link to post.php (the full edit screen).
- Some parity with the list view (e.g. date filter, bulk selection/action).
- "Uploaded To" shows the post ID instead of a title.
- Clicking on the edit icon itself doesn't work.
#62
follow-up:
↓ 65
@
10 years ago
24716.20.diff adds keyboard navigation (left and right arrows) to the media detail modal. keyboard on the grid via tab/shift tab seems reasonable already, although full arrow key support including up/down might be nice
Notes & questions:
- when navigating the images, the modal is closed and recreated each time you change images; can we swap the content in place?
- in order to properly capture the keyboard events, the inner part of the modal needs focus after being opened; this patch puts the focus on the first input field in the media details (url) - suggestions?
- thoughts about adding some visual feedback (briefly highlight left/right arrows?) when navigating by keyboard?
- uses ._once to avoid keyboard race conditions
#65
in reply to:
↑ 62
;
follow-up:
↓ 66
@
10 years ago
Replying to adamsilverstein:
- when navigating the images, the modal is closed and recreated each time you change images; can we swap the content in place?
What's the benefit there?
#66
in reply to:
↑ 65
@
10 years ago
Replying to ericlewis:
Replying to adamsilverstein:
- when navigating the images, the modal is closed and recreated each time you change images; can we swap the content in place?
What's the benefit there?
small benefit - not having to destroy/recreate the modal for each item view; not a big concern, works fine as is :)
#67
@
10 years ago
24716.23.diff remove extra space on right for better responsive layout
before - http://cl.ly/image/3q422v0e2B06
after - http://cl.ly/image/462e2o0F1e07
#68
@
10 years ago
24716.24.diff includes keyboard nav; adds state urls -- image=xxx, search=xxx; also adds history; saw some issues in testing going back between searches and detail view, using browser history; maybe loose history?
#71
@
10 years ago
In attachment:24716.27.diff, require only the model and the library to the EditAttachment frame, instead of the grid's controller. Trigger edit:attachment:previous
and edit:attachment:next
events on the EditAttachment frame, decoupling the two controllers.
#72
@
10 years ago
24716.29.diff builds on 24716.28.diff;
added:
- keyboard navigation (attached to window gave me best results, tried attaching to view), excludes input/textarea so you can still use arrow keys when editing those, removing event handler on modal close
- Backbone routes and history support for image details & search string, back button takes you back thru states, bookmarking/emailing a link to a search or specific image also works
- fixed undefined error with explicit check
#73
@
10 years ago
in attachment:24716.30.diff, add style .attachments-browser.hide-sidebar .uploader-inline { right: 0; }
so inline uploader centers correctly in the grid.
#74
@
10 years ago
In 24716.31.diff: clear search from url when search field is cleared
#75
@
10 years ago
in attachment:24716.32.diff, defer the call to media.view.Attachments.css()
until after the view has been rendered so the width of attachments is applied according to the container's size rather than the default 120px.
#76
@
10 years ago
In attachment:24716.33.diff, get rid of the toolbar region in the EditAttachment frame. We were thinking of using it, but decided we're not.
#77
@
10 years ago
- do not blow away attachment/inline uploader views in the AttachmentsBrowser depending on context; hide the view that is irrelevant instead.
- if there is no media in your library or results from a query, give that feedback rather than presenting the uploader immediately. Consider adding a link to open the uploader.
- rejigger the uploader as a slidedown panel within the browser.
#78
@
10 years ago
attachment:24716.35.diff is half way to bulk select.
#79
@
10 years ago
We still need to account for space for admin notices at the top of the screen. See admin_notices.png -- it's still all mashed together.
This ticket was mentioned in IRC in #wordpress-dev by helen. View the logs.
10 years ago
#81
@
10 years ago
In attachment:24716.36.diff, Bulk Editing.
Introduce modes to frames to tell us whether we're in single edit or bulk edit mode. Separate from region modes, but a similar concept.
#84
@
10 years ago
attachment:24716.37.diff = 27 + 30 + 32 + 33 + 34 + 36 + upping max thumbsizes from 120px to 150px
#86
@
10 years ago
- keyboard navigation in item detail (left/right)
- routing, browser url / bookmarking for detail & search
- history has issues
#87
@
10 years ago
What would be nice was if the media grid was consistent design-wise with how the theme installation screen looks and works. See https://core.trac.wordpress.org/attachment/ticket/24716/media-library.png.
In my mockup clicking on the "Visiblity" toggle would reveal a drawer below the filter bar (in the same way as the Feature Filter on theme-install.php) with the list of checkboxes where you can toggle the visiblity of the Name, Date, Mine-type etc. rather than having lesser used options constantly visible. This would solve the issue of them being hidden on smaller screens.
I already have a patch (#28794) which seperates the filter bar from themes.css and into a seperate file with a more reuseable approach by using .wp-filter rather than .theme-navigation.
Having an API for the filter bar to make it more reuseable would be nice too, especially for plugin developers. The ability to create an instance and then methods to create toggable drawers, filter links, search and so forth. If this was all tied into a Backbone-based API where all of the filter bar components (filtering, search, bulk editing, etc) would be tied to data (collections) it would be a good start to phasing out WP_List_Table and finding a solution for #28050. This is all out-of-scope for 4.0 obviously, and has a lot of backwards compatibility implications.
#89
@
10 years ago
Mentioned to ericlewis in passing that the display options should really go back up in screen options. Whatever we may think of their discoverability, I think it would be worse to have it be different on just this one screen.
#90
in reply to:
↑ 33
@
10 years ago
Ack! The CSS is full of absolute values, 24716.40.diff is a simple JS fix.
Replying to DrewAPicture:
Looks like we also didn't account for admin notices at the top of the grid view, as seen in admin_notices.png above.
#91
@
10 years ago
Error in Chrome Dev Tools when $_GET['item']
param is present, but no image in media http://i.imgur.com/H3tvQDZ.png
Uncaught TypeError: Cannot read property 'attributes' of undefined media-grid.js?ver=4.0-alpha-29018-src:304
When I click Delete Permanently the modal dialog doesn't close, but the image is removed.
Sorry, but no experience with Backbone so far, so couldn't fix.
#92
@
10 years ago
The file input is clickable even if not visible http://i.imgur.com/CdMa8fK.png
Screencast at https://youtu.be/DLbRBDBEh7w
#93
@
10 years ago
In attachment:24716.42.diff, override methods in media.controller.EditImageNoFrame
instead of creating the abstract media.controller._State
.
#94
@
10 years ago
In attachment:24716.43.diff, make the edit attachment icon clickable. Hide it in bulk select mode.
#99
@
10 years ago
Clickable file input still an issue https://www.youtube.com/watch?v=5oT5JcVxOPc
#102
@
10 years ago
Missing scroll if a lot of images were uploaded http://i.imgur.com/Ztrjjpn.png
Disabling webkit-transform
helped http://i.imgur.com/nUGPnTL.png but the uploader input is overlapping with photos.
#113
@
10 years ago
In attachment:24716.45.diff, while in Bulk Edit mode, any selected attachment should have the blue border, rather than just the last clicked one.
#114
@
10 years ago
In attachment:24716.46.diff, make the Uploader closable.
#118
@
10 years ago
Just an observation but the icons for grid and list jump from left to right when you switch between each.
Perhaps having them in the same place would help with UI?
Thanks,
Wil.
This ticket was mentioned in IRC in #wordpress-dev by michalzuber. View the logs.
10 years ago
#127
@
10 years ago
- Keywords needs-patch dev-feedback removed
Leaving open for tracking, but please open new tickets for any individual issues, including any already listed here. We have reached the point where keeping track among comments and patches is impossible.
#131
follow-up:
↓ 132
@
10 years ago
please what happen when i can access my wordpress admin password
#132
in reply to:
↑ 131
@
10 years ago
Replying to chaben25:
please what happen when i can access my wordpress admin password
Password keeping is the responsibility of the user. If you lost it you can reset it by visiting {site_url}/wp-login.php?action=lostpassword
This ticket was mentioned in IRC in #wordpress-dev by melchoyce. View the logs.
10 years ago
#136
@
10 years ago
Thoughts:
Grid view should be nothing but big, touchable images. Those fields are litter that should go. Grid view is a new thing that should not be encumbered with parity to a past that can still be accessed via a click/tap.
Make grid view the default view and put it first in the switcher list.
Think in taps, not clicks.
The list view needs parity with the grid view. More comfortable thumbnails, view/edit modal, love.
The ability to spin up a new post with the current selection inserted as a gallery would be super decent.
#137
@
10 years ago
Plugins that build on top of the media modal but provide their own attachment views will get bitten by r29065 where the click/select handle changed from .attachment-preview
to .js--select-attachment
. Example: http://plugins.svn.wordpress.org/getty-images/tags/2.0/getty-templates.php
#139
follow-up:
↓ 142
@
10 years ago
Lazy loading in the media grid is not lazy enough. The scroll event on the view never occurs because the view itself is never scrolled, but the scroll method keeps firing from ready() up until all attachments are loaded on the page. Looks like we need to watch for the scroll event on the document, rather than the view.
See 24716.52.diff, haven't tested outside of Chrome and FF on OS X.
@
10 years ago
Patch to move the view switcher in the list view to the left to match what is being displayed in the new grid view. Not tested for rtl languages.
#141
@
10 years ago
See patch.
As pbearne request I've modified the code to move the view switcher to the left side on grid view. However, this still needs testing for rtl languages.
#142
in reply to:
↑ 139
@
10 years ago
Replying to kovshenin:
... the scroll method keeps firing from ready() up until all attachments are loaded on the page. Looks like we need to watch for the scroll event on the document, rather than the view.
Great, it works for me, but with the "refreshThreshold" value set to 3 maybe it's still loading too many attachments. I've tested with 200 attachments and on the first page load, it fires 4 ajax requests each one with "posts_per_page" set to 40 so the final results is 160 attachments.
Your mileage may vary depending on the thumbnail size, your screen size (if you have your browser window maximized) or if you shrink your browser window height, you may get 3 or 4 requests. But basically it keeps loading attachments till the body scrollHeight is less than its clientHeight * 3. Sort of 3 "pages" of thumbnails.
Also, I'm not so sure the "refreshThreshold" should multiply, in all infinite scroll implementations I've seen, the threshold value is *added*.
Of course, it's better to have 160 attachments than *all* the attachments loaded :) But please consider to review the threshold thing. I could easily propose a patch arbitrarily changing "refreshThreshold" value say to "2" but probably this needs more testing and feedback from users with different devices, screen sizes etc.
I agree that it would be cool to explore something other than the standard list table layout for attachments, like we do for themes. However, a note that we should be avoiding the exclusive use of hover for information display, as it's neither accessible nor touch friendly. Also keep in mind that columns can be added/removed for post type list tables, which would have to be accommodated.