Make WordPress Core


Ignore:
Timestamp:
08/09/2014 07:38:40 PM (11 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.