Make WordPress Core


Ignore:
Timestamp:
08/09/2014 07:38:40 PM (12 years ago)
Author:
wonderboymusic
Message:

Video:

  • Don't set height on responsive <div> 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 <body>
  • Fix some CSS rule collision in the grid modal

See #29110.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-includes/media-template.php

    r29436 r29456  
    5151        $video_types = wp_get_video_extensions();
    5252?>
    53 <#  var w_rule = '', h_rule = '',
     53<#  var w_rule = '',
    5454                w, h, settings = wp.media.view.settings,
    5555                isYouTube = ! _.isEmpty( data.model.src ) && data.model.src.match(/youtube|youtu\.be/);
     
    7070                w_rule = ' width: ' + w + 'px;';
    7171        }
    72 
    73         if ( h ) {
    74                 h_rule = ' height: auto';
    75         }
    7672#>
    77 <div style="max-width: 100%;{{ w_rule }}{{ h_rule }}">
     73<div style="{{ w_rule }}" class="wp-video">
    7874<video controls
    7975        class="wp-video-shortcode{{ isYouTube ? ' youtube-video' : '' }}"
     
    279275                                        <div class="media-progress-bar"><div></div></div>
    280276                                <# } else if ( 'image' === data.type ) { #>
    281                                         <img src="{{ data.sizes.full.url }}" draggable="false" />
     277                                        <img class="details-image" src="{{ data.sizes.full.url }}" draggable="false" />
    282278                                <# } else if ( -1 === jQuery.inArray( data.type, [ 'audio', 'video' ] ) ) { #>
    283                                         <img src="{{ data.icon }}" class="icon" draggable="false" />
     279                                        <img class="details-image" src="{{ data.icon }}" class="icon" draggable="false" />
    284280                                <# } #>
    285281
     
    291287                                </div>
    292288                                <# } else if ( 'video' === data.type ) {
    293                                         var w_rule = h_rule = '';
     289                                        var w_rule = '';
    294290                                        if ( data.width ) {
    295                                                 w_rule = ' width: ' + data.width + 'px;';
     291                                                w_rule = 'width: ' + data.width + 'px;';
    296292                                        } else if ( wp.media.view.settings.contentWidth ) {
    297                                                 w_rule = ' width: ' + wp.media.view.settings.contentWidth + 'px;';
    298                                         }
    299                                         if ( data.height ) {
    300                                                 h_rule = ' height: auto';
     293                                                w_rule = 'width: ' + wp.media.view.settings.contentWidth + 'px;';
    301294                                        }
    302295                                #>
    303                                 <div style="max-width: 100%; {{ w_rule }}{{ h_rule }}" class="wp-media-wrapper">
    304                                         <video controls class="wp-video-shortcode" preload="metadata"
     296                                <div style="{{ w_rule }}" class="wp-media-wrapper wp-video">
     297                                        <video controls="controls" class="wp-video-shortcode" preload="metadata"
    305298                                                <# if ( data.width ) { #>width="{{ data.width }}"<# } #>
    306299                                                <# if ( data.height ) { #>height="{{ data.height }}"<# } #>
Note: See TracChangeset for help on using the changeset viewer.