Media Grid: Improve uploader

[ocean90]

After clicking Add New the uploader flies in. The status of the button is unchanged, clicking it again will hide the uploader again. I think the button should hold the active state while the uploader is visible.

Correct me if I'm wrong but currently there is no other place where we let elements fly around. And we shouldn't start to this. I want the uploader immediately and don't want to wait for a second until the animation has finished. I prefer more something like we have on media-new.php or theme-install.php?upload, which is less distracting for uploading files.

We probably should also mention, that the whole screen is a dropzone for the uploader.

Related Issues:

• When you scroll to the end of the grid and click Add New you will get the uploader which overlays the the first half of the media. So it's possible that you won't see that you media has been uploaded because the new media is placed on top of the list, which I currently can't see. Feels wrong.
• Uploaded files will be selected, also when uploading multiple files, but multiple selection should be disabled until bulk edit is activated.

[ericlewis]

attachment:28851.diff​ removes CSS transitions in lieu of some classic display: none. Also fixes #28840

[ocean90]

In 29131:

Media Grid: Remove CSS transition from inline uploader.

props ericlewis.
fixes #28840.
see #28851.

[ericlewis]

In 28851.3.diff:

• Parity of language and general styling on media-new.php.
• Adding the dashed line lets a user know that they can drag and drop media without reading any text.
• De-emphasize the select files button.
• Tighten up the close button placement.
• Remove a period at the end of "Maximum upload file size: 32 MB.", as that isn't really a sentence.

[michalzuber]

Much better, separates No media found. Try a different search. message from uploader ​http://i.imgur.com/9xftDyt.png

[ocean90]

• <p>or</p> has no i18n
• Don't remove the fullstop in "Maximum upload file size: %s.", othwise we have two strings for the same (see /wp-admin/includes/media.php)

[michalzuber]

Edit of 28851.3.diff, props ocean90

[michalzuber]

Replying to ocean90:

• Don't remove the fullstop in "Maximum upload file size: %s.", othwise we have two strings for the same (see /wp-admin/includes/media.php)

Right, good idea wp-admin/includes/media.php#L1859

[wonderboymusic]

In 29296:

Media Grid: improve uploader styles.

Props michalzuber, ericlewis.
See #28851.

[michalzuber]

props ocean90, too ;)

[ocean90]

In 29303:

Media Grid: Add context for "or" in [29296].

see #28851.

[ocean90]

In 29304:

Media Grid: Improve dropzone margins when viewport height is <400px.

see #28851.

[ocean90]

There is no visible error message when file size is above the maximum file size.

[ocean90]

Replying to ocean90:

There is no visible error message when file size is above the maximum file size.

See #29037.

[michalzuber]

Remove margin: 0; at wp-includes/css/media-views.css#L1273, because h3 is too near to the border ​http://i.imgur.com/wzbMy6S.png

[michalzuber]

Remove h3 margin: 0

[azaozz]

In 29373:

Media modal: use the same classes to hide the "or" that is above the "Select files" button when no drag-drop support. See #28851.

[michalzuber]

Replying to michalzuber:

Remove margin: 0; at wp-includes/css/media-views.css#L1273, because h3 is too near to the border ​http://i.imgur.com/wzbMy6S.png

Could somebody check that h3 fix 28851.5.diff ?

[ocean90]

Replying to michalzuber:

See ticket:28963:5.