Commit Graph

16 Commits

Author SHA1 Message Date
Scott Taylor 42a66ea424 Make playlist tracks keyboard-accessible.
Fixes #27644.


Built from https://develop.svn.wordpress.org/trunk@28023


git-svn-id: http://core.svn.wordpress.org/trunk@27853 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2014-04-07 22:28:16 +00:00
Scott Taylor 6ec61c7506 Call MediaElement's shim method for `setSrc()` when dynamically updating the playing source in playlists, which will properly set the source for mobile.
Make the labels for playlist items slightly smaller to account for size on mobile.

Fixes #27625.


Built from https://develop.svn.wordpress.org/trunk@27895


git-svn-id: http://core.svn.wordpress.org/trunk@27726 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2014-04-01 19:04:14 +00:00
Scott Taylor 7aaa878a6f Make `<audio>` elements in playlists responsive.
See #27625.


Built from https://develop.svn.wordpress.org/trunk@27894


git-svn-id: http://core.svn.wordpress.org/trunk@27725 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2014-04-01 18:47:14 +00:00
Scott Taylor b6ac65f07f Using percentages for playlist font-sizing was ambitious, but fell prey to `editor-style.css` in the admin. We have switched to using pixels. The editor styles were also forcing MediaElement players to inherit `font-family`, which was undesirable. And while we're at it, remove the top and bottom border from the playlist's list of tracks, which adds a dash of lovely to the playlist's default styles.
Props nacin for the addition of `&mdash;` in the playlist track list.
Fixes #27600.


Built from https://develop.svn.wordpress.org/trunk@27865


git-svn-id: http://core.svn.wordpress.org/trunk@27696 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2014-03-30 22:12:16 +00:00
Helen Hou-Sandí afbcf169b0 Set baseline colors for the light playlist skin. props kwight. fixes #27562.
Built from https://develop.svn.wordpress.org/trunk@27805


git-svn-id: http://core.svn.wordpress.org/trunk@27639 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2014-03-28 03:38:14 +00:00
Scott Taylor 0c34f4f136 Make the CSS selector for current playlist item `<img>` more specific so the width is properly constrained.
Hide the `<audio>` element in the playlist to prevent a flicker when loading - MEjs hides the audio element anyway.

See #27525.


Built from https://develop.svn.wordpress.org/trunk@27742


git-svn-id: http://core.svn.wordpress.org/trunk@27579 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2014-03-26 16:51:16 +00:00
Scott Taylor a17dd704c4 Create a new file, `media-audiovideo.js`, to house all of the audio and video JS code in core.
UX Changes:
* Don't add a menu item for "Add Audio|Video Source"
* In the Audio|Video Details modal, add buttons and some suggestive text for adding alternate playback sources
* Don't show "Create Audio|Video Playlist" menu items until the user has uploaded audio or video files

See #27437.


Built from https://develop.svn.wordpress.org/trunk@27608


git-svn-id: http://core.svn.wordpress.org/trunk@27451 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2014-03-19 05:31:15 +00:00
Scott Taylor e47bc77616 Load MediaElement's CSS when TinyMCE is loaded via `$mce_css` in `editor_settings()`. Add some baseline styles in `wp-content.css` for audio, video, and embed tags to ensure their `max-width` is `100%`, regardless of whether MEjs is implemented in TinyMCE.
See #27389.


Built from https://develop.svn.wordpress.org/trunk@27534


git-svn-id: http://core.svn.wordpress.org/trunk@27377 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2014-03-14 12:34:16 +00:00
Scott Taylor 394feb8f91 Add a class, `wp-playlist-playing`, to the currently loaded track when tracks are displayed. Add some subtle styles for light and dark playlist themes.
See #27321.


Built from https://develop.svn.wordpress.org/trunk@27489


git-svn-id: http://core.svn.wordpress.org/trunk@27333 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2014-03-10 00:15:14 +00:00
Scott Taylor f078f3e10e Video editing in the media modal:
* Add a state: `Add Subititles`
* Add `text/vtt` to the list of allowed mime-types, files end in `.vtt`. `.srt` files are served as `text/plain`.
* The content body of a video shortcode should be used for adding `<track>` elements only. This happens dynamically in the modal. If added by hand, they can still be parsed and managed.

See #27016.


Built from https://develop.svn.wordpress.org/trunk@27481


git-svn-id: http://core.svn.wordpress.org/trunk@27325 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2014-03-09 10:32:15 +00:00
Scott Taylor 8e2e99fd0c Since audio and video shortcodes don't point at actual attachments, don't persist the library's selection. Move the media instructions in the block that scrolls.
See #27016.


Built from https://develop.svn.wordpress.org/trunk@27480


git-svn-id: http://core.svn.wordpress.org/trunk@27324 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2014-03-09 06:24:15 +00:00
Scott Taylor f7af18e1d6 Audio/Video shortcodes in the media modal:
* Make a generic model, `wp.media.model.PostMedia`, which replaces `wp.media.model.PostAudio` and `wp.media.model.PostVideo`
* Make a generic library, `wp.media.controller.MediaLibrary`, which replaces `wp.media.controller.ReplaceVideo` and `wp.media.controller.ReplaceAudio`
* `wp.media.controller.MediaLibrary` is used to create new states that want to load a library filtered by type, making it incredibly simple to add states to frames. See `wp.media.view.MediaFrame.VideoDetails` and `wp.media.view.MediaFrame.AudioDetails`.

UX changes:

* Add the ability to manage HTML5 fallbacks - add additional `<source>`s or remove specific `<source>`s
* In the Video Details state, add the ability to select a poster image

See #27016.


Built from https://develop.svn.wordpress.org/trunk@27478


git-svn-id: http://core.svn.wordpress.org/trunk@27322 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2014-03-09 05:25:15 +00:00
Scott Taylor ff8844deae Add TinyMCE placeholders for `audio` and `video` shortcodes.
* Add `wp.media.mixin`.
* Add `wp.media.audio` and `wp.media.video`.
* Add `wp.media.model.PostAudio` and `wp.media.model.PostVideo`
* Add `wp.media.controller.AudioDetails` and `wp.media.controller.VideoDetails`.
* Add `wp.media.controller.ReplaceAudio` and `wp.media.controller.ReplaceVideo`.
* Add `wp.media.view.MediaFrame.AudioDetails` and `wp.media.view.MediaFrame.VideoDetails`.
* Add `wp.media.view.AudioDetails` and `wp.media.view.VideoDetails`.
* Update the `wpgallery` TinyMCE plugin.
* Display audio and video players in the media modal when shortcode is clicked.
* Provide a UI to edit shortcode attributes in the media modal.
* Provide a UI to replace the `src` media file in an `audio` or `video` shortcode.

See #27016.


Built from https://develop.svn.wordpress.org/trunk@27411


git-svn-id: http://core.svn.wordpress.org/trunk@27258 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2014-03-05 15:06:14 +00:00
Scott Taylor 943f295d2e Add core support for Playlists and Video Playlists.
* Playlists operate like galleries in the admin. 
* Provide default UI and JS support in themes using MediaElement and Backbone. 
* The shortcodes are clickable, editable, and configurable using the media modal. 
* Playlists support images for each item, whether or not the current theme supports images for `attachment:audio` and `attachment:video`
* Playlists respond to `$content_width` and resize videos accordingly.
* All playlist data is included inline, using a script tag with `type="application/json"`, allowing anyone to unenqueue the WP playlist JS and roll their own.
* Playlist styles are minimal and work out of the box in the last 5 default themes. They inherit and adapt to the current theme's font styles, and their rules are easily overrideable.

See #26631.


Built from https://develop.svn.wordpress.org/trunk@27239


git-svn-id: http://core.svn.wordpress.org/trunk@27096 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2014-02-24 18:08:16 +00:00
Andrew Nacin 6861353737 Set audio player to width: 100% and avoid breaking the layout in iOS when we fall back to a link.
props markjaquith, davidjlaietta.
fixes #24896.



git-svn-id: http://core.svn.wordpress.org/trunk@24948 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2013-08-01 14:48:39 +00:00
Dion Hulse 566e3764c3 Move the Mediaelement.js include into the wp-includes/js folder, rather than wp-includes directly. Fixes the mediaplayer in browsers which don't support <audio> directly.
Props DrewAPicture See #23282.


git-svn-id: http://core.svn.wordpress.org/trunk@23732 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2013-03-16 08:43:19 +00:00