Make WordPress Core

Ticket #27320: 27320.6.diff

File 27320.6.diff, 23.5 KB (added by wonderboymusic, 11 years ago)
  • src/wp-includes/js/media-audiovideo.js

     
    11/* global _wpMediaViewsL10n, _wpmejsSettings, MediaElementPlayer, tinymce, WPPlaylistView */
    22
    3 (function ($, _, Backbone) {
    4         var media = wp.media, l10n = typeof _wpMediaViewsL10n === 'undefined' ? {} : _wpMediaViewsL10n;
     3(function($, _, Backbone) {
     4        var media = wp.media,
     5                baseSettings = {},
     6                l10n = typeof _wpMediaViewsL10n === 'undefined' ? {} : _wpMediaViewsL10n;
    57
     8        if ( ! _.isUndefined( window._wpmejsSettings ) ) {
     9                baseSettings.pluginPath = _wpmejsSettings.pluginPath;
     10        }
     11
    612        /**
    713         * @mixin
    814         */
     
    1117                /**
    1218                 * Pauses every instance of MediaElementPlayer
    1319                 */
    14                 pauseAllPlayers: function () {
     20                pauseAllPlayers: function() {
    1521                        var p;
    1622                        if ( window.mejs && window.mejs.players ) {
    1723                                for ( p in window.mejs.players ) {
     
    2430                 * Utility to identify the user's browser
    2531                 */
    2632                ua: {
    27                         is : function (browser) {
     33                        is : function( browser ) {
    2834                                var passes = false, ua = window.navigator.userAgent;
    2935
    3036                                switch ( browser ) {
     
    4450                                                passes = ua.match(/safari/gi) !== null && ua.match(/chrome/gi) === null;
    4551                                        break;
    4652                                        case 'chrome':
    47                                                 passes = ua.match(/safari/gi) && ua.match(/chrome/gi) !== null;
     53                                                passes = ua.match(/safari/gi) !== null && ua.match(/chrome/gi) !== null;
    4854                                        break;
    4955                                }
    5056
     
    8591                 * @param {jQuery} media
    8692                 * @returns {Boolean}
    8793                 */
    88                 isCompatible: function ( media ) {
     94                isCompatible: function( media ) {
    8995                        if ( ! media.find( 'source' ).length ) {
    9096                                return false;
    9197                        }
     
    98104
    99105                        sources = media.find( 'source' );
    100106
    101                         _.find( this.compat, function (supports, browser) {
     107                        _.find( this.compat, function( supports, browser ) {
    102108                                if ( ua.is( browser ) ) {
    103109                                        found = true;
    104                                         _.each( sources, function (elem) {
     110                                        _.each( sources, function( elem ) {
    105111                                                var audio = new RegExp( 'audio\/(' + supports.audio.join('|') + ')', 'gi' ),
    106112                                                        video = new RegExp( 'video\/(' + supports.video.join('|') + ')', 'gi' );
    107113
     
    214220                        caption : ''
    215221                },
    216222
    217                 edit : function (data) {
     223                edit : function( data ) {
    218224                        var frame, shortcode = wp.shortcode.next( 'audio', data ).shortcode;
    219225                        frame = wp.media({
    220226                                frame: 'audio',
    221227                                state: 'audio-details',
    222                                 metadata: _.defaults(
    223                                         shortcode.attrs.named,
    224                                         wp.media.audio.defaults
    225                                 )
     228                                metadata: _.defaults( shortcode.attrs.named, this.defaults )
    226229                        });
    227230
    228231                        return frame;
    229232                },
    230233
    231                 shortcode : function (model) {
     234                shortcode : function( model ) {
    232235                        var self = this, content;
    233236
    234237                        _.each( this.defaults, function( value, key ) {
     
    268271                        autoplay : false,
    269272                        preload : 'metadata',
    270273                        content : '',
    271                         caption : ''
     274                        caption : '',
     275                        width : 640,
     276                        height : 360
    272277                },
    273278
    274                 edit : function (data) {
     279                edit : function( data ) {
    275280                        var frame,
    276                                 defaults = this.defaults,
    277281                                shortcode = wp.shortcode.next( 'video', data ).shortcode,
    278282                                attrs;
    279283
     
    283287                        frame = wp.media({
    284288                                frame: 'video',
    285289                                state: 'video-details',
    286                                 metadata: _.defaults( attrs, defaults )
     290                                metadata: _.defaults( attrs, this.defaults )
    287291                        });
    288292
    289293                        return frame;
    290294                },
    291295
    292                 shortcode : function (model) {
     296                shortcode : function( model ) {
    293297                        var self = this, content;
    294298
    295299                        _.each( this.defaults, function( value, key ) {
     
    312316        };
    313317
    314318        /**
    315          * wp.media.model.PostMedia
     319         * Shared model class for audio and video. Updates the model after
     320         *   "Add Audio|Video Source" and "Replace Audio|Video" states return
    316321         *
    317322         * @constructor
    318323         * @augments Backbone.Model
    319          **/
     324         */
    320325        media.model.PostMedia = Backbone.Model.extend({
    321326                initialize: function() {
    322327                        this.attachment = false;
    323328                },
    324329
    325                 setSource: function ( attachment ) {
     330                setSource: function( attachment ) {
    326331                        this.attachment = attachment;
    327                         this.extension = attachment.get('filename' ).split('.').pop();
     332                        this.extension = attachment.get( 'filename' ).split('.').pop();
    328333
    329334                        if ( this.get( 'src' ) && this.extension === this.get( 'src' ).split('.').pop() ) {
    330335                                this.unset( 'src' );
     
    343348                        this.setSource( attachment );
    344349
    345350                        this.unset( 'src' );
    346                         _.each( _.without( wp.media.view.settings.embedExts, this.extension ), function (ext) {
     351                        _.each( _.without( wp.media.view.settings.embedExts, this.extension ), function( ext ) {
    347352                                self.unset( ext );
    348353                        } );
    349354                }
     
    350355        });
    351356
    352357        /**
    353          * wp.media.controller.AudioDetails
     358         * The controller for the Audio Details state
    354359         *
    355360         * @constructor
    356361         * @augments wp.media.controller.State
     
    357362         * @augments Backbone.Model
    358363         */
    359364        media.controller.AudioDetails = media.controller.State.extend({
    360                 defaults: _.defaults({
     365                defaults: {
    361366                        id: 'audio-details',
    362367                        toolbar: 'audio-details',
    363368                        title: l10n.audioDetailsTitle,
     
    364369                        content: 'audio-details',
    365370                        menu: 'audio-details',
    366371                        router: false,
    367                         attachment: false,
    368                         priority: 60,
    369                         editing: false
    370                 }, media.controller.Library.prototype.defaults ),
     372                        priority: 60
     373                },
    371374
    372375                initialize: function( options ) {
    373376                        this.media = options.media;
     
    376379        });
    377380
    378381        /**
    379          * wp.media.controller.VideoDetails
     382         * The controller for the Video Details state
    380383         *
    381384         * @constructor
    382385         * @augments wp.media.controller.State
     
    383386         * @augments Backbone.Model
    384387         */
    385388        media.controller.VideoDetails = media.controller.State.extend({
    386                 defaults: _.defaults({
     389                defaults: {
    387390                        id: 'video-details',
    388391                        toolbar: 'video-details',
    389392                        title: l10n.videoDetailsTitle,
     
    390393                        content: 'video-details',
    391394                        menu: 'video-details',
    392395                        router: false,
    393                         attachment: false,
    394                         priority: 60,
    395                         editing: false
    396                 }, media.controller.Library.prototype.defaults ),
     396                        priority: 60
     397                },
    397398
    398399                initialize: function( options ) {
    399400                        this.media = options.media;
     
    480481
    481482                },
    482483
    483                 renderDetailsToolbar: function() {
     484                setPrimaryButton: function(text, handler) {
    484485                        this.toolbar.set( new media.view.Toolbar({
    485486                                controller: this,
    486487                                items: {
    487                                         select: {
     488                                        button: {
    488489                                                style:    'primary',
    489                                                 text:     l10n.update,
     490                                                text:     text,
    490491                                                priority: 80,
    491 
    492                                                 click: function() {
    493                                                         var controller = this.controller,
    494                                                                 state = controller.state();
    495 
    496                                                         controller.close();
    497 
    498                                                         state.trigger( 'update', controller.media.toJSON() );
    499 
     492                                                click:    function() {
     493                                                        var controller = this.controller;
     494                                                        handler.call( this, controller, controller.state() );
    500495                                                        // Restore and reset the default state.
    501496                                                        controller.setState( controller.options.state );
    502497                                                        controller.reset();
     
    506501                        }) );
    507502                },
    508503
     504                renderDetailsToolbar: function() {
     505                        this.setPrimaryButton( l10n.update, function( controller, state ) {
     506                                controller.close();
     507                                state.trigger( 'update', controller.media.toJSON() );
     508                        } );
     509                },
     510
    509511                renderReplaceToolbar: function() {
    510                         this.toolbar.set( new media.view.Toolbar({
    511                                 controller: this,
    512                                 items: {
    513                                         replace: {
    514                                                 style:    'primary',
    515                                                 text:     l10n.replace,
    516                                                 priority: 80,
    517 
    518                                                 click: function() {
    519                                                         var controller = this.controller,
    520                                                                 state = controller.state(),
    521                                                                 selection = state.get( 'selection' ),
    522                                                                 attachment = selection.single();
    523 
    524                                                         controller.media.changeAttachment( attachment );
    525 
    526                                                         state.trigger( 'replace', controller.media.toJSON() );
    527 
    528                                                         // Restore and reset the default state.
    529                                                         controller.setState( controller.options.state );
    530                                                         controller.reset();
    531                                                 }
    532                                         }
    533                                 }
    534                         }) );
     512                        this.setPrimaryButton( l10n.replace, function( controller, state ) {
     513                                var attachment = state.get( 'selection' ).single();
     514                                controller.media.changeAttachment( attachment );
     515                                state.trigger( 'replace', controller.media.toJSON() );
     516                        } );
    535517                },
    536518
    537519                renderAddSourceToolbar: function() {
    538                         this.toolbar.set( new media.view.Toolbar({
    539                                 controller: this,
    540                                 items: {
    541                                         replace: {
    542                                                 style:    'primary',
    543                                                 text:     this.addText,
    544                                                 priority: 80,
    545 
    546                                                 click: function() {
    547                                                         var controller = this.controller,
    548                                                                 state = controller.state(),
    549                                                                 selection = state.get( 'selection' ),
    550                                                                 attachment = selection.single();
    551 
    552                                                         controller.media.setSource( attachment );
    553 
    554                                                         state.trigger( 'add-source', controller.media.toJSON() );
    555 
    556                                                         // Restore and reset the default state.
    557                                                         controller.setState( controller.options.state );
    558                                                         controller.reset();
    559                                                 }
    560                                         }
    561                                 }
    562                         }) );
     520                        this.setPrimaryButton( this.addText, function( controller, state ) {
     521                                var attachment = state.get( 'selection' ).single();
     522                                controller.media.setSource( attachment );
     523                                state.trigger( 'add-source', controller.media.toJSON() );
     524                        } );
    563525                }
    564526        });
    565527
     
    606568                createStates: function() {
    607569                        this.states.add([
    608570                                new media.controller.AudioDetails( {
    609                                         media: this.media,
    610                                         editable: false,
    611                                         menu: 'audio-details'
     571                                        media: this.media
    612572                                } ),
    613573
    614574                                new media.controller.MediaLibrary( {
     
    677637                createStates: function() {
    678638                        this.states.add([
    679639                                new media.controller.VideoDetails({
    680                                         media: this.media,
    681                                         editable: false,
    682                                         menu: 'video-details'
     640                                        media: this.media
    683641                                }),
    684642
    685643                                new media.controller.MediaLibrary( {
     
    721679                },
    722680
    723681                renderSelectPosterImageToolbar: function() {
    724                         this.toolbar.set( new media.view.Toolbar({
    725                                 controller: this,
    726                                 items: {
    727                                         replace: {
    728                                                 style:    'primary',
    729                                                 text:     l10n.videoSelectPosterImageTitle,
    730                                                 priority: 80,
     682                        this.setPrimaryButton( l10n.videoSelectPosterImageTitle, function( controller, state ) {
     683                                var attachment = state.get( 'selection' ).single();
    731684
    732                                                 click: function() {
    733                                                         var controller = this.controller,
    734                                                                 state = controller.state(),
    735                                                                 selection = state.get( 'selection' ),
    736                                                                 attachment = selection.single();
    737 
    738                                                         controller.media.set( 'poster', attachment.get( 'url' ) );
    739 
    740                                                         state.trigger( 'set-poster-image', controller.media.toJSON() );
    741 
    742                                                         // Restore and reset the default state.
    743                                                         controller.setState( controller.options.state );
    744                                                         controller.reset();
    745                                                 }
    746                                         }
    747                                 }
    748                         }) );
     685                                controller.media.set( 'poster', attachment.get( 'url' ) );
     686                                state.trigger( 'set-poster-image', controller.media.toJSON() );
     687                        } );
    749688                },
    750689
    751690                renderAddTrackToolbar: function() {
    752                         this.toolbar.set( new media.view.Toolbar({
    753                                 controller: this,
    754                                 items: {
    755                                         replace: {
    756                                                 style:    'primary',
    757                                                 text:     l10n.videoAddTrackTitle,
    758                                                 priority: 80,
     691                        this.setPrimaryButton( l10n.videoAddTrackTitle, function( controller, state ) {
     692                                var attachment = state.get( 'selection' ).single(),
     693                                        content = controller.media.get( 'content' );
    759694
    760                                                 click: function() {
    761                                                         var controller = this.controller,
    762                                                                 state = controller.state(),
    763                                                                 selection = state.get( 'selection' ),
    764                                                                 attachment = selection.single(),
    765                                                                 content = controller.media.get( 'content' );
     695                                if ( -1 === content.indexOf( attachment.get( 'url' ) ) ) {
     696                                        content += [
     697                                                '<track srclang="en" label="English"kind="subtitles" src="',
     698                                                attachment.get( 'url' ),
     699                                                '" />'
     700                                        ].join('');
    766701
    767                                                         if ( -1 === content.indexOf( attachment.get( 'url' ) ) ) {
    768                                                                 content += [
    769                                                                         '<track srclang="en" label="English"kind="subtitles" src="',
    770                                                                         attachment.get( 'url' ),
    771                                                                         '" />'
    772                                                                 ].join('');
    773 
    774                                                                 controller.media.set( 'content', content );
    775                                                         }
    776 
    777                                                         state.trigger( 'add-track', controller.media.toJSON() );
    778 
    779                                                         // Restore and reset the default state.
    780                                                         controller.setState( controller.options.state );
    781                                                         controller.reset();
    782                                                 }
    783                                         }
     702                                        controller.media.set( 'content', content );
    784703                                }
    785                         }) );
     704                                state.trigger( 'add-track', controller.media.toJSON() );
     705                        } );
    786706                }
    787707        });
    788708
     
    827747                 *
    828748                 * @param {Event} e
    829749                 */
    830                 removeSetting : function (e) {
     750                removeSetting : function(e) {
    831751                        var wrap = $( e.currentTarget ).parent(), setting;
    832 
    833752                        setting = wrap.find( 'input' ).data( 'setting' );
    834753
    835754                        if ( setting ) {
     
    844763                 *
    845764                 * @fires wp.media.view.MediaDetails#media:setting:remove
    846765                 */
    847                 setTracks : function () {
     766                setTracks : function() {
    848767                        var tracks = '';
    849768
    850                         _.each( this.$('.content-track'), function (track) {
     769                        _.each( this.$('.content-track'), function(track) {
    851770                                tracks += $( track ).val();
    852771                        } );
    853772
     
    858777                /**
    859778                 * @global MediaElementPlayer
    860779                 */
    861                 setPlayer : function () {
     780                setPlayer : function() {
    862781                        if ( ! this.player && this.media ) {
    863782                                this.player = new MediaElementPlayer( this.media, this.settings );
    864783                        }
     
    867786                /**
    868787                 * @abstract
    869788                 */
    870                 setMedia : function () {
     789                setMedia : function() {
    871790                        return this;
    872791                },
    873792
    874                 success : function (mejs) {
     793                success : function(mejs) {
    875794                        var autoplay = mejs.attributes.autoplay && 'false' !== mejs.attributes.autoplay;
    876795
    877796                        if ( 'flash' === mejs.pluginType && autoplay ) {
    878                                 mejs.addEventListener( 'canplay', function () {
     797                                mejs.addEventListener( 'canplay', function() {
    879798                                        mejs.play();
    880799                                }, false );
    881800                        }
     
    884803                },
    885804
    886805                /**
    887                  * @global _wpmejsSettings
    888                  *
    889806                 * @returns {media.view.MediaDetails} Returns itself to allow chaining
    890807                 */
    891808                render: function() {
    892                         var self = this, settings = {
    893                                 success : this.success
    894                         };
     809                        var self = this;
    895810
    896                         if ( ! _.isUndefined( window._wpmejsSettings ) ) {
    897                                 settings.pluginPath = _wpmejsSettings.pluginPath;
    898                         }
    899 
    900811                        media.view.Settings.AttachmentDisplay.prototype.render.apply( this, arguments );
    901812                        setTimeout( function() { self.resetFocus(); }, 10 );
    902813
    903                         this.settings = settings;
     814                        this.settings = _.defaults( {
     815                                success : this.success
     816                        }, baseSettings );
    904817
    905818                        return this.setMedia();
    906819                },
     
    914827                /**
    915828                 * When multiple players in the DOM contain the same src, things get weird.
    916829                 *
    917                  * @param {HTMLElement} media
     830                 * @param {HTMLElement} elem
    918831                 * @returns {HTMLElement}
    919832                 */
    920                 prepareSrc : function (media) {
    921                         var i = wp.media.view.MediaDetails.instances++;
    922                         _.each( $(media).find('source'), function (source) {
     833                prepareSrc : function( elem ) {
     834                        var i = media.view.MediaDetails.instances++;
     835                        _.each( $( elem ).find( 'source' ), function( source ) {
    923836                                source.src = [
    924837                                        source.src,
    925838                                        source.src.indexOf('?') > -1 ? '&' : '?',
     
    926839                                        '_=',
    927840                                        i
    928841                                ].join('');
    929                         });
     842                        } );
    930843
    931                         return media;
     844                        return elem;
    932845                }
    933846        });
    934847
     
    1010923                 * @param {Object} settings
    1011924                 * @returns {Object}
    1012925                 */
    1013                 counts : (function (settings) {
     926                counts : (function(settings) {
    1014927                        var counts = {};
    1015928
    1016                         return  function () {
     929                        return  function() {
    1017930                                if ( ! _.isEmpty( counts ) ) {
    1018931                                        return counts;
    1019932                                }
    1020933
    1021934                                var a = 0, v = 0;
    1022                                 _.each( settings.attachmentCounts, function (total, mime) {
     935                                _.each( settings.attachmentCounts, function(total, mime) {
    1023936                                        var type;
    1024937                                        if ( -1 < mime.indexOf('/') ) {
    1025938                                                type = mime.split('/')[0];
     
    1050963                 * @param {Object} options
    1051964                 * @returns {Array}
    1052965                 */
    1053                 states : function (options) {
     966                states : function(options) {
    1054967                        return [
    1055968                                new media.controller.Library({
    1056969                                        id:         'playlist',
     
    10931006                 * @param {Object} options
    10941007                 * @returns {Array}
    10951008                 */
    1096                 videoStates : function (options) {
     1009                videoStates : function(options) {
    10971010                        return [
    10981011                                new media.controller.Library({
    10991012                                        id:         'video-playlist',
     
    11831096
    11841097                        data = window.decodeURIComponent( $( node ).attr('data-wpview-text') );
    11851098                        frame = media.edit( data );
    1186                         frame.on( 'close', function () {
     1099                        frame.on( 'close', function() {
    11871100                                frame.detach();
    11881101                        } );
    11891102                        frame.state( self.state ).on( 'update', function( selection ) {
     
    12191132                 * @param {Event} e
    12201133                 * @param {HTMLElement} node
    12211134                 */
    1222                 setPlayer: function (e, node) {
     1135                setPlayer: function(e, node) {
    12231136                        // if the ready event fires on an empty node
    12241137                        if ( ! node ) {
    12251138                                return;
     
    12271140
    12281141                        var self = this,
    12291142                                media,
    1230                                 settings = {},
     1143                                firefox = this.ua.is( 'ff' ),
    12311144                                className = '.wp-' +  this.shortcode.tag + '-shortcode';
    12321145
    12331146                        if ( this.player ) {
     
    12361149
    12371150                        media = $( node ).find( className );
    12381151
    1239                         if ( ! _.isUndefined( window._wpmejsSettings ) ) {
    1240                                 settings.pluginPath = _wpmejsSettings.pluginPath;
    1241                         }
    1242 
    12431152                        if ( ! this.isCompatible( media ) ) {
    12441153                                media.closest( '.wpview-wrap' ).addClass( 'wont-play' );
    12451154                                if ( ! media.parent().hasClass( 'wpview-wrap' ) ) {
     
    12491158                                return;
    12501159                        } else {
    12511160                                media.closest( '.wpview-wrap' ).removeClass( 'wont-play' );
    1252                                 if ( this.ua.is( 'ff' ) ) {
     1161                                if ( firefox ) {
    12531162                                        media.prop( 'preload', 'metadata' );
    12541163                                } else {
    12551164                                        media.prop( 'preload', 'none' );
     
    12591168                        media = wp.media.view.MediaDetails.prepareSrc( media.get(0) );
    12601169
    12611170                        // Thanks, Firefox!
    1262                         setTimeout(function () {
    1263                                 self.player = new MediaElementPlayer( media, settings );
    1264                         }, 50);
     1171                        if ( firefox ) {
     1172                                setTimeout( function() {
     1173                                        self.player = new MediaElementPlayer( media, baseSettings );
     1174                                }, 50 );
     1175                        } else {
     1176                                this.player = new MediaElementPlayer( media, baseSettings );
     1177                        }
    12651178                },
    12661179
    12671180                /**
     
    12701183                 * @returns {string}
    12711184                 */
    12721185                getHtml: function() {
    1273                         var attrs = this.shortcode.attrs.named;
     1186                        var attrs = _.defaults(
     1187                                this.shortcode.attrs.named,
     1188                                wp.media[ this.shortcode.tag ].defaults
     1189                        );
    12741190                        return this.template({ model: attrs });
    12751191                }
    12761192        });
     
    13321248                 * @param {Event} e
    13331249                 * @param {HTMLElement} node
    13341250                 */
    1335                 setNode: function (e, node) {
     1251                setNode: function(e, node) {
    13361252                        this.node = node;
    13371253                        this.fetch();
    13381254                },
     
    13531269                 * @global WPPlaylistView
    13541270                 * @global tinymce.editors
    13551271                 */
    1356                 setPlayer: function () {
     1272                setPlayer: function() {
    13571273                        var p,
    13581274                                html = this.getHtml(),
    13591275                                t = this.encodedText,
     
    13651281                                var doc;
    13661282                                if ( editor.plugins.wpview ) {
    13671283                                        doc = editor.getDoc();
    1368                                         $( doc ).find( '[data-wpview-text="' + t + '"]' ).each(function (i, elem) {
     1284                                        $( doc ).find( '[data-wpview-text="' + t + '"]' ).each(function(i, elem) {
    13691285                                                var node = $( elem );
    13701286                                                node.html( html );
    13711287                                                self.node = elem;
     
    14141330                                artists: data.artists
    14151331                        };
    14161332
    1417                         _.each( attachments, function (attachment) {
    1418                                 var size = {}, track = {
     1333                        _.each( attachments, function( attachment ) {
     1334                                var size = {}, resize = {}, track = {
    14191335                                        src : attachment.url,
    14201336                                        type : attachment.mime,
    14211337                                        title : attachment.title,
     
    14251341                                };
    14261342
    14271343                                if ( 'video' === type ) {
    1428                                         if ( ! options.width ) {
    1429                                                 options.width = attachment.width;
    1430                                                 options.height = attachment.height;
    1431                                         }
    14321344                                        size.width = attachment.width;
    14331345                                        size.height = attachment.height;
     1346                                        if ( media.view.settings.contentWidth ) {
     1347                                                resize.width = media.view.settings.contentWidth - 22;
     1348                                                resize.height = Math.ceil( ( size.height * resize.width ) / size.width );
     1349                                                if ( ! options.width ) {
     1350                                                        options.width = resize.width;
     1351                                                        options.height = resize.height;
     1352                                                }
     1353                                        } else {
     1354                                                if ( ! options.width ) {
     1355                                                        options.width = attachment.width;
     1356                                                        options.height = attachment.height;
     1357                                                }
     1358                                        }
    14341359                                        track.dimensions = {
    14351360                                                original : size,
    1436                                                 resized : size
     1361                                                resized : _.isEmpty( resize ) ? size : resize
    14371362                                        };
    14381363                                } else {
    14391364                                        options.width = 400;
     
    14831408        function init() {
    14841409                $(document.body)
    14851410                        .on( 'click', '.wp-switch-editor', wp.media.mixin.pauseAllPlayers )
    1486                         .on( 'click', '.add-media-source', function () {
     1411                        .on( 'click', '.add-media-source', function() {
    14871412                                media.frame.setState('add-' + media.frame.defaults.id + '-source');
    14881413                        } );
    14891414        }
  • src/wp-includes/js/tinymce/skins/wordpress/wp-content.css

     
    164164        max-width: 100%;
    165165}
    166166
     167audio {
     168        visibility: hidden;
     169}
     170
    167171/**
    168172 * WP Views
    169173 */
  • src/wp-includes/media-template.php

     
    4848function wp_underscore_video_template() {
    4949        $video_types = wp_get_video_extensions();
    5050?>
    51 <#
    52 var isYouTube = ! _.isEmpty( data.model.src ) && data.model.src.match(/youtube|youtu\.be/);
    53         w = ! data.model.width || data.model.width > 640 ? 640 : data.model.width,
    54         h = ! data.model.height ? 360 : data.model.height;
     51<#  var w, h, settings = wp.media.view.settings,
     52                isYouTube = ! _.isEmpty( data.model.src ) && data.model.src.match(/youtube|youtu\.be/);
    5553
    56 if ( data.model.width && w !== data.model.width ) {
    57         h = Math.ceil( ( h * w ) / data.model.width );
    58 }
     54        if ( settings.contentWidth && data.model.width >= settings.contentWidth ) {
     55                w = settings.contentWidth;
     56        } else {
     57                w = data.model.width;
     58        }
     59
     60        if ( w !== data.model.width ) {
     61                h = Math.ceil( ( h * w ) / data.model.width );
     62        } else {
     63                h = data.model.height;
     64        }
    5965#>
    6066<div style="max-width: 100%; width: {{ w }}px">
    6167<video controls
     
    8591                if ( isYouTube ) { #>
    8692                <source src="{{ data.model.src }}" type="video/youtube" />
    8793                <# } else { #>
    88                 <source src="{{ data.model.src }}" type="{{ wp.media.view.settings.embedMimes[ data.model.src.split('.').pop() ] }}" />
     94                <source src="{{ data.model.src }}" type="{{ settings.embedMimes[ data.model.src.split('.').pop() ] }}" />
    8995                <# }
    9096        } #>
    9197
    9298        <?php foreach ( $video_types as $type ):
    9399        ?><# if ( data.model.<?php echo $type ?> ) { #>
    94         <source src="{{ data.model.<?php echo $type ?> }}" type="{{ wp.media.view.settings.embedMimes[ '<?php echo $type ?>' ] }}" />
     100        <source src="{{ data.model.<?php echo $type ?> }}" type="{{ settings.embedMimes[ '<?php echo $type ?>' ] }}" />
    95101        <# } #>
    96102        <?php endforeach; ?>
    97103        {{{ data.model.content }}}
  • src/wp-includes/media.php

     
    11971197        $default_width = 640;
    11981198        $default_height = 360;
    11991199
    1200         $theme_width = $content_width - $outer;
    1201         $theme_height = round( ( $default_height * $theme_width ) / $default_width );
     1200        $theme_width = empty( $content_width ) ? $default_width : ( $content_width - $outer );
     1201        $theme_height = empty( $content_width ) ? $default_height : round( ( $default_height * $theme_width ) / $default_width );
    12021202
    12031203        $data = compact( 'type', 'style' );
    12041204
     
    15851585                }
    15861586        } else {
    15871587                // if the video is bigger than the theme
    1588                 if ( $width > $content_width ) {
     1588                if ( ! empty( $content_width ) && $width > $content_width ) {
    15891589                        $height = round( ( $height * $content_width ) / $width );
    15901590                        $width = $content_width;
    15911591                }
     
    23812381        if ( did_action( 'wp_enqueue_media' ) )
    23822382                return;
    23832383
     2384        global $content_width;
     2385
    23842386        $defaults = array(
    23852387                'post' => null,
    23862388        );
     
    24312433                'defaultProps' => $props,
    24322434                'attachmentCounts' => wp_count_attachments(),
    24332435                'embedExts'    => $exts,
    2434                 'embedMimes'   => $ext_mimes
     2436                'embedMimes'   => $ext_mimes,
     2437                'contentWidth' => $content_width,
    24352438        );
    24362439
    24372440        $post = null;