Videos in the media modal:

* Support rendering of chromeless YouTube when a video shortcode's `src` is a YouTube URL. 
* Don't instantiate an instance of `MediaElementPlayer` until after the view has been attached to the DOM and the view's `ready` event has fired.
* Don't set `poster` for videos when its value is empty. Much like `src` in the `img` tag - when empty, it will assume and load the current window's URL.
* When removing a player instance, don't call the `pause` method if the playback is not native.

See #27016.



git-svn-id: https://develop.svn.wordpress.org/trunk@27452 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Scott Taylor
2014-03-07 08:31:57 +00:00
parent 5e5caca113
commit 0143c2d90a
2 changed files with 72 additions and 17 deletions
+44 -6
View File
@@ -739,11 +739,41 @@ function wp_print_media_templates() {
var w = ! data.model.width || data.model.width > 640 ? 640 : data.model.width,
h = ! data.model.height ? 360 : data.model.height;
if ( w !== data.model.width ) {
if ( data.model.width && w !== data.model.width ) {
h = Math.ceil( ( h * w ) / data.model.width );
}
if ( data.model.src ) { #>
if ( data.model.src ) {
if ( data.model.src.match(/youtube|youtu\.be/) ) {
#>
<video controls
class="wp-video-shortcode youtube-video"
width="{{{ w }}}"
height="{{{ h }}}"
<?php
$props = array( 'poster' => '', 'preload' => 'metadata' );
foreach ( $props as $key => $value ):
if ( empty( $value ) ) {
?><#
if ( ! _.isUndefined( data.model.<?php echo $key ?> ) && data.model.<?php echo $key ?> ) {
#> <?php echo $key ?>="{{{ data.model.<?php echo $key ?> }}}"<#
} #>
<?php } else {
echo $key ?>="{{{ _.isUndefined( data.model.<?php echo $key ?> ) ? '<?php echo $value ?>' : data.model.<?php echo $key ?> }}}"<?php
}
endforeach;
?><#
<?php foreach ( array( 'autoplay', 'loop' ) as $attr ):
?> if ( ! _.isUndefined( data.model.<?php echo $attr ?> ) && data.model.<?php echo $attr ?> ) {
#> <?php echo $attr ?><#
}
<?php endforeach ?>#>
>
<source type="video/youtube" src="{{{ data.model.src }}}" />
</video>
<#
} else {
#>
<video controls
class="wp-video-shortcode"
width="{{{ w }}}"
@@ -752,8 +782,15 @@ function wp_print_media_templates() {
<?php
$props = array( 'poster' => '', 'preload' => 'metadata' );
foreach ( $props as $key => $value ):
echo $key ?>="{{{ _.isUndefined( data.model.<?php echo $key ?> ) ? '<?php echo $value ?>' : data.model.<?php echo $key ?> }}}"
<?php endforeach;
if ( empty( $value ) ) {
?><#
if ( ! _.isUndefined( data.model.<?php echo $key ?> ) && data.model.<?php echo $key ?> ) {
#> <?php echo $key ?>="{{{ data.model.<?php echo $key ?> }}}"<#
} #>
<?php } else {
echo $key ?>="{{{ _.isUndefined( data.model.<?php echo $key ?> ) ? '<?php echo $value ?>' : data.model.<?php echo $key ?> }}}"<?php
}
endforeach;
?><#
<?php foreach ( array( 'autoplay', 'loop' ) as $attr ):
?> if ( ! _.isUndefined( data.model.<?php echo $attr ?> ) && data.model.<?php echo $attr ?> ) {
@@ -761,12 +798,13 @@ function wp_print_media_templates() {
}
<?php endforeach ?>#>
/>
<# rendered = true; #>
<label class="setting">
<span>SRC</span>
<input type="text" disabled="disabled" data-setting="src" value="{{{ data.model.src }}}" />
</label>
<# } #>
<# }
rendered = true;
} #>
<?php
$default_types = wp_get_video_extensions();