From 45368dbfaab503078d64c6f7f634c238c9307b2a Mon Sep 17 00:00:00 2001 From: Scott Taylor Date: Sat, 9 Aug 2014 19:38:40 +0000 Subject: [PATCH] Video: * Don't set height on responsive `
` when generating markup * Move some CSS rules from the style tag to `.wp-video` * Use Video Details view event delegation instead of click events delegated from `` * Fix some CSS rule collision in the grid modal See #29110. git-svn-id: https://develop.svn.wordpress.org/trunk@29456 602fd350-edb4-49c9-b593-d223f7449a82 --- src/wp-includes/css/media-views.css | 2 +- src/wp-includes/js/media-audiovideo.js | 21 ++++++---------- .../js/mediaelement/wp-mediaelement.css | 5 ++++ src/wp-includes/media-template.php | 25 +++++++------------ src/wp-includes/media.php | 9 ++----- 5 files changed, 24 insertions(+), 38 deletions(-) diff --git a/src/wp-includes/css/media-views.css b/src/wp-includes/css/media-views.css index 217a770e13..204cce1cb3 100644 --- a/src/wp-includes/css/media-views.css +++ b/src/wp-includes/css/media-views.css @@ -2681,7 +2681,7 @@ height: 100%; } -.edit-attachment-frame .attachment-media-view img { +.edit-attachment-frame .attachment-media-view .details-image { display: block; margin-bottom: 16px; max-width: 100%; diff --git a/src/wp-includes/js/media-audiovideo.js b/src/wp-includes/js/media-audiovideo.js index 5e02ba8124..c971469bfb 100644 --- a/src/wp-includes/js/media-audiovideo.js +++ b/src/wp-includes/js/media-audiovideo.js @@ -636,7 +636,8 @@ this.events = _.extend( this.events, { 'click .remove-setting' : 'removeSetting', 'change .content-track' : 'setTracks', - 'click .remove-track' : 'setTracks' + 'click .remove-track' : 'setTracks', + 'click .add-media-source' : 'addSource' } ); media.view.Settings.AttachmentDisplay.prototype.initialize.apply( this, arguments ); @@ -682,6 +683,11 @@ this.trigger( 'media:setting:remove', this ); }, + addSource : function( e ) { + this.controller.lastMime = $( e.currentTarget ).data( 'mime' ); + this.controller.setState( 'add-' + this.controller.defaults.id + '-source' ); + }, + /** * @global MediaElementPlayer */ @@ -822,17 +828,4 @@ } }); - /** - * Event binding - */ - function init() { - $(document.body) - .on( 'click', '.add-media-source', function( e ) { - media.frame.lastMime = $( e.currentTarget ).data( 'mime' ); - media.frame.setState( 'add-' + media.frame.defaults.id + '-source' ); - } ); - } - - $( init ); - }(jQuery, _, Backbone)); diff --git a/src/wp-includes/js/mediaelement/wp-mediaelement.css b/src/wp-includes/js/mediaelement/wp-mediaelement.css index c95b88b1dd..c9a814ed2b 100644 --- a/src/wp-includes/js/mediaelement/wp-mediaelement.css +++ b/src/wp-includes/js/mediaelement/wp-mediaelement.css @@ -92,6 +92,11 @@ margin: 0 0 10px; } +.wp-video { + max-width: 100%; + height: auto; +} + video.wp-video-shortcode, .wp-video-shortcode video { max-width: 100%; diff --git a/src/wp-includes/media-template.php b/src/wp-includes/media-template.php index 5f52993452..9185e9944d 100644 --- a/src/wp-includes/media-template.php +++ b/src/wp-includes/media-template.php @@ -50,7 +50,7 @@ function wp_underscore_audio_template() { function wp_underscore_video_template() { $video_types = wp_get_video_extensions(); ?> -<# var w_rule = '', h_rule = '', +<# var w_rule = '', w, h, settings = wp.media.view.settings, isYouTube = ! _.isEmpty( data.model.src ) && data.model.src.match(/youtube|youtu\.be/); @@ -69,12 +69,8 @@ function wp_underscore_video_template() { if ( w ) { w_rule = ' width: ' + w + 'px;'; } - - if ( h ) { - h_rule = ' height: auto'; - } #> -
+
<# } else if ( 'video' === data.type ) { - var w_rule = h_rule = ''; + var w_rule = ''; if ( data.width ) { - w_rule = ' width: ' + data.width + 'px;'; + w_rule = 'width: ' + data.width + 'px;'; } else if ( wp.media.view.settings.contentWidth ) { - w_rule = ' width: ' + wp.media.view.settings.contentWidth + 'px;'; - } - if ( data.height ) { - h_rule = ' height: auto'; + w_rule = 'width: ' + wp.media.view.settings.contentWidth + 'px;'; } #> -
-