WordPress.org

Make WordPress Core

Ticket #27016: 27016.5.diff

File 27016.5.diff, 32.3 KB (added by wonderboymusic, 6 years ago)

  • src/wp-includes/css/media-views.css

     
    14601460}
    14611461
    14621462.embed-link-settings,
    1463 .embed-image-settings {
     1463.embed-media-settings {
    14641464        position: absolute;
    14651465        top: 60px;
    14661466        left: 0;
    … …  
    14701470        overflow: auto;
    14711471}
    14721472
    1473 .image-details .embed-image-settings {
     1473.image-details .embed-media-settings {
    14741474        top: 0;
    14751475}
    14761476
    … …  
    15231523        margin: 2px 0;
    15241524}
    15251525
    1526 .media-embed .setting input,
     1526.media-embed .setting input[type="text"],
    15271527.media-embed .setting textarea {
    15281528        display: block;
    15291529        width: 100%;
    … …  
    18721872
    18731873        /* Image From Link */
    18741874        .embed-link-settings,
    1875         .embed-image-settings {
     1875        .embed-media-settings {
    18761876                padding-bottom: 52px;
    18771877        }
    18781878

  • src/wp-includes/js/media-editor.js

     
    593593                }));
    594594        }());
    595595
     596        wp.media.audio = {
     597                defaults : {
     598                        id : wp.media.view.settings.post.id,
     599                        src      : '',
     600                        loop     : '',
     601                        autoplay : '',
     602                        preload  : 'none'
     603                },
     604
     605                shortcode : function (shortcode) {
     606                        _.each( wp.media.audio.defaults, function( value, key ) {
     607                                if ( value === shortcode[ key ] ) {
     608                                        delete shortcode[ key ];
     609                                }
     610                        });
     611
     612                        return wp.shortcode.string({
     613                                tag:     'audio',
     614                                attrs:   shortcode
     615                        });
     616                }
     617        };
     618
     619        wp.media.video = {
     620                defaults : {
     621                        id : wp.media.view.settings.post.id,
     622                        src : '',
     623                        poster : '',
     624                        loop : '',
     625                        autoplay : '',
     626                        preload : 'metadata'
     627                },
     628
     629                shortcode : function (shortcode) {
     630                        _.each( wp.media.video.defaults, function( value, key ) {
     631                                if ( value === shortcode[ key ] ) {
     632                                        delete shortcode[ key ];
     633                                }
     634                        });
     635
     636                        return wp.shortcode.string({
     637                                tag:     'video',
     638                                attrs:   shortcode
     639                        });
     640                }
     641        };
     642
    596643        /**
    597644         * wp.media.featuredImage
    598645         * @namespace

  • src/wp-includes/js/media-models.js

     
    3232                        frame = new MediaFrame.Post( attributes );
    3333                } else if ( 'image' === attributes.frame && MediaFrame.ImageDetails ) {
    3434                        frame = new MediaFrame.ImageDetails( attributes );
     35                } else if ( 'audio' === attributes.frame && MediaFrame.AudioDetails ) {
     36                        frame = new MediaFrame.AudioDetails( attributes );
     37                } else if ( 'video' === attributes.frame && MediaFrame.VideoDetails ) {
     38                        frame = new MediaFrame.VideoDetails( attributes );
    3539                }
    3640
    3741                delete attributes.frame;
    … …  
    448452        });
    449453
    450454        /**
     455         * wp.media.model.PostAudio
     456         *
     457         * @constructor
     458         * @augments Backbone.Model
     459         **/
     460        PostAudio = media.model.PostAudio = Backbone.Model.extend({
     461                initialize: function() {
     462                        this.attachment = false;
     463                },
     464
     465                changeAttachment: function( attachment, props ) {
     466                        var self = this;
     467
     468                        this.attachment = attachment;
     469                        this.extension = attachment.get('filename' ).split('.').pop();
     470
     471                        if ( _.contains( wp.media.view.settings.embedExts, this.extension ) ) {
     472                                this.set( this.extension, attachment.get( 'url' ) );
     473                        } else {
     474                                this.set( this.extension, '' );
     475                        }
     476
     477                        _.each( _.without( wp.media.view.settings.embedExts, this.extension ), function (ext) {
     478                                self.set( ext, '' );
     479                        } );
     480                }
     481        });
     482
     483        /**
     484         * wp.media.model.PostVideo
     485         *
     486         * @constructor
     487         * @augments Backbone.Model
     488         **/
     489        PostVideo = media.model.PostVideo = Backbone.Model.extend({
     490                initialize: function() {
     491                        this.attachment = false;
     492                },
     493
     494                changeAttachment: function( attachment, props ) {
     495                        var self = this;
     496
     497                        this.attachment = attachment;
     498                        this.extension = attachment.get('filename' ).split('.').pop();
     499
     500                        if ( _.contains( wp.media.view.settings.embedExts, this.extension ) ) {
     501                                this.set( this.extension, attachment.get( 'url' ) );
     502                        } else {
     503                                this.set( this.extension, '' );
     504                        }
     505
     506                        _.each( _.without( wp.media.view.settings.embedExts, this.extension ), function (ext) {
     507                                self.set( ext, '' );
     508                        } );
     509                }
     510        });
     511
     512        /**
    451513         * wp.media.model.Attachments
    452514         *
    453515         * @constructor

  • src/wp-includes/js/media-views.js

     
    760760        });
    761761
    762762        /**
     763         * wp.media.controller.AudioDetails
     764         *
     765         * @constructor
     766         * @augments wp.media.controller.State
     767         * @augments Backbone.Model
     768         */
     769        media.controller.AudioDetails = media.controller.State.extend({
     770                defaults: _.defaults({
     771                        id: 'audio-details',
     772                        toolbar: 'audio-details',
     773                        title: l10n.audioDetailsTitle,
     774                        content: 'audio-details',
     775                        menu: 'audio-details',
     776                        router: false,
     777                        attachment: false,
     778                        priority: 60,
     779                        editing: false
     780                }, media.controller.Library.prototype.defaults ),
     781
     782                initialize: function( options ) {
     783                        this.audio = options.audio;
     784                        media.controller.State.prototype.initialize.apply( this, arguments );
     785                }
     786        });
     787
     788        /**
     789         * wp.media.controller.VideoDetails
     790         *
     791         * @constructor
     792         * @augments wp.media.controller.State
     793         * @augments Backbone.Model
     794         */
     795        media.controller.VideoDetails = media.controller.State.extend({
     796                defaults: _.defaults({
     797                        id: 'video-details',
     798                        toolbar: 'video-details',
     799                        title: l10n.videoDetailsTitle,
     800                        content: 'video-details',
     801                        menu: 'video-details',
     802                        router: false,
     803                        attachment: false,
     804                        priority: 60,
     805                        editing: false
     806                }, media.controller.Library.prototype.defaults ),
     807
     808                initialize: function( options ) {
     809                        this.video = options.video;
     810                        media.controller.State.prototype.initialize.apply( this, arguments );
     811                }
     812        });
     813
     814        /**
    763815         * wp.media.controller.CollectionEdit
    764816         *
    765817         * @static
    … …  
    10631115                }
    10641116        });
    10651117
    1066         /**
    1067          * wp.media.controller.ReplaceImage
    1068          *
    1069          * Replace a selected single image
    1070          *
    1071          * @constructor
    1072          * @augments wp.media.controller.Library
    1073          * @augments wp.media.controller.State
    1074          * @augments Backbone.Model
    1075          */
    1076         media.controller.ReplaceImage = media.controller.Library.extend({
    1077                 defaults: _.defaults({
    1078                         id:         'replace-image',
    1079                         filterable: 'uploaded',
    1080                         multiple:   false,
    1081                         toolbar:    'replace',
    1082                         title:      l10n.replaceImageTitle,
    1083                         priority:   60,
    1084                         syncSelection: false
    1085                 }, media.controller.Library.prototype.defaults ),
     1118        media.controller.ReplaceMedia = function (type, args) {
     1119                return media.controller.Library.extend({
     1120                        defaults: _.defaults({
     1121                                id:         'replace-' + type,
     1122                                filterable: 'uploaded',
     1123                                multiple:   false,
     1124                                toolbar:    'replace',
     1125                                title:      args.title,
     1126                                priority:   60,
     1127                                syncSelection: false
     1128                        }, media.controller.Library.prototype.defaults ),
    10861129
    1087                 initialize: function( options ) {
    1088                         var library, comparator;
     1130                        initialize: function( options ) {
     1131                                var library, comparator;
    10891132
    1090                         this.image = options.image;
    1091                         // If we haven't been provided a `library`, create a `Selection`.
    1092                         if ( ! this.get('library') ) {
    1093                                 this.set( 'library', media.query({ type: 'image' }) );
    1094                         }
     1133                                this[type] = options[type];
     1134                                // If we haven't been provided a `library`, create a `Selection`.
     1135                                if ( ! this.get('library') ) {
     1136                                        this.set( 'library', media.query({ type: type }) );
     1137                                }
    10951138
    1096                         media.controller.Library.prototype.initialize.apply( this, arguments );
     1139                                media.controller.Library.prototype.initialize.apply( this, arguments );
    10971140
    1098                         library    = this.get('library');
    1099                         comparator = library.comparator;
     1141                                library    = this.get('library');
     1142                                comparator = library.comparator;
    11001143
    1101                         // Overload the library's comparator to push items that are not in
    1102                         // the mirrored query to the front of the aggregate collection.
    1103                         library.comparator = function( a, b ) {
    1104                                 var aInQuery = !! this.mirroring.get( a.cid ),
    1105                                         bInQuery = !! this.mirroring.get( b.cid );
     1144                                // Overload the library's comparator to push items that are not in
     1145                                // the mirrored query to the front of the aggregate collection.
     1146                                library.comparator = function( a, b ) {
     1147                                        var aInQuery = !! this.mirroring.get( a.cid ),
     1148                                                bInQuery = !! this.mirroring.get( b.cid );
    11061149
    1107                                 if ( ! aInQuery && bInQuery ) {
    1108                                         return -1;
    1109                                 } else if ( aInQuery && ! bInQuery ) {
    1110                                         return 1;
    1111                                 } else {
    1112                                         return comparator.apply( this, arguments );
    1113                                 }
    1114                         };
     1150                                        if ( ! aInQuery && bInQuery ) {
     1151                                                return -1;
     1152                                        } else if ( aInQuery && ! bInQuery ) {
     1153                                                return 1;
     1154                                        } else {
     1155                                                return comparator.apply( this, arguments );
     1156                                        }
     1157                                };
    11151158
    1116                         // Add all items in the selection to the library, so any featured
    1117                         // images that are not initially loaded still appear.
    1118                         library.observe( this.get('selection') );
    1119                 },
     1159                                // Add all items in the selection to the library, so any featured
     1160                                // images that are not initially loaded still appear.
     1161                                library.observe( this.get('selection') );
     1162                        },
    11201163
    1121                 activate: function() {
    1122                         this.updateSelection();
    1123                         media.controller.Library.prototype.activate.apply( this, arguments );
    1124                 },
     1164                        activate: function() {
     1165                                this.updateSelection();
     1166                                media.controller.Library.prototype.activate.apply( this, arguments );
     1167                        },
    11251168
    1126                 updateSelection: function() {
    1127                         var selection = this.get('selection'),
    1128                                 attachment = this.image.attachment;
     1169                        updateSelection: function() {
     1170                                var selection = this.get('selection'),
     1171                                        attachment = this[type].attachment;
    11291172
    1130                         selection.reset( attachment ? [ attachment ] : [] );
    1131                 }
    1132         });
     1173                                selection.reset( attachment ? [ attachment ] : [] );
     1174                        }
     1175                });
     1176        };
    11331177
    11341178        /**
     1179         * wp.media.controller.ReplaceImage
     1180         *
     1181         * Replace a selected single image
     1182         *
     1183         * @constructor
     1184         * @augments wp.media.controller.Library
     1185         * @augments wp.media.controller.State
     1186         * @augments Backbone.Model
     1187         */
     1188        media.controller.ReplaceImage = media.controller.ReplaceMedia( 'image', {
     1189                title : l10n.replaceImageTitle
     1190        } );
     1191        /**
     1192         * wp.media.controller.ReplaceAudio
     1193         *
     1194         * Replace a selected single audio
     1195         *
     1196         * @constructor
     1197         * @augments wp.media.controller.Library
     1198         * @augments wp.media.controller.State
     1199         * @augments Backbone.Model
     1200         */
     1201        media.controller.ReplaceAudio = media.controller.ReplaceMedia( 'audio', {
     1202                title : l10n.replaceAudioTitle
     1203        } );
     1204        /**
     1205         * wp.media.controller.ReplaceVideo
     1206         *
     1207         * Replace a selected single video
     1208         *
     1209         * @constructor
     1210         * @augments wp.media.controller.Library
     1211         * @augments wp.media.controller.State
     1212         * @augments Backbone.Model
     1213         */
     1214        media.controller.ReplaceVideo = media.controller.ReplaceMedia( 'video', {
     1215                title : l10n.replaceVideoTitle
     1216        } );
     1217
     1218        /**
    11351219         * wp.media.controller.Embed
    11361220         *
    11371221         * @constructor
    … …  
    23482432                }
    23492433        });
    23502434
    2351         media.view.MediaFrame.ImageDetails = media.view.MediaFrame.Select.extend({
    2352                 defaults: {
    2353                         id:      'image',
    2354                         url:     '',
    2355                         menu:    'image-details',
    2356                         content: 'image-details',
    2357                         toolbar: 'image-details',
    2358                         type:    'link',
    2359                         title:    l10n.imageDetailsTitle,
    2360                         priority: 120
    2361                 },
     2435        media.view.MediaFrame.MediaDetails = function (type, args) {
     2436                return media.view.MediaFrame.Select.extend({
     2437                        defaults: {
     2438                                id:      type,
     2439                                url:     '',
     2440                                menu:    type + '-details',
     2441                                content: type + '-details',
     2442                                toolbar: type + '-details',
     2443                                type:    'link',
     2444                                title:    args.title,
     2445                                priority: 120
     2446                        },
    23622447
    2363                 initialize: function( options ) {
    2364                         this.image = new media.model.PostImage( options.metadata );
    2365                         this.options.selection = new media.model.Selection( this.image.attachment, { multiple: false } );
    2366                         media.view.MediaFrame.Select.prototype.initialize.apply( this, arguments );
    2367                 },
     2448                        initialize: function( options ) {
     2449                                this[type] = new media.model[args.model]( options.metadata );
     2450                                this.options.selection = new media.model.Selection( this[type].attachment, { multiple: false } );
     2451                                media.view.MediaFrame.Select.prototype.initialize.apply( this, arguments );
     2452                        },
    23682453
    2369                 bindHandlers: function() {
    2370                         media.view.MediaFrame.Select.prototype.bindHandlers.apply( this, arguments );
    2371                         this.on( 'menu:create:image-details', this.createMenu, this );
    2372                         this.on( 'content:render:image-details', this.renderImageDetailsContent, this );
    2373                         this.on( 'menu:render:image-details', this.renderMenu, this );
    2374                         this.on( 'toolbar:render:image-details', this.renderImageDetailsToolbar, this );
    2375                         // override the select toolbar
    2376                         this.on( 'toolbar:render:replace', this.renderReplaceImageToolbar, this );
    2377                 },
     2454                        bindHandlers: function() {
     2455                                media.view.MediaFrame.Select.prototype.bindHandlers.apply( this, arguments );
     2456                                this.on( 'menu:create:' + type + '-details', this.createMenu, this );
     2457                                this.on( 'content:render:' + type + '-details', this.renderDetailsContent, this );
     2458                                this.on( 'menu:render:' + type + '-details', this.renderMenu, this );
     2459                                this.on( 'toolbar:render:' + type + '-details', this.renderDetailsToolbar, this );
     2460                                // override the select toolbar
     2461                                this.on( 'toolbar:render:replace', this.renderReplaceToolbar, this );
     2462                        },
    23782463
    2379                 createStates: function() {
    2380                         this.states.add([
    2381                                 new media.controller.ImageDetails({
    2382                                         image: this.image,
    2383                                         editable: false,
    2384                                         menu: 'image-details'
    2385                                 }),
    2386                                 new media.controller.ReplaceImage({
    2387                                         id: 'replace-image',
    2388                                         library:   media.query( { type: 'image' } ),
    2389                                         image: this.image,
    2390                                         multiple:  false,
    2391                                         title:     l10n.imageReplaceTitle,
    2392                                         menu: 'image-details',
    2393                                         toolbar: 'replace',
    2394                                         priority:  80,
    2395                                         displaySettings: true
    2396                                 })
    2397                         ]);
    2398                 },
     2464                        createStates: function() {
     2465                                var detailsParams = {
     2466                                                editable: false,
     2467                                                menu: type + '-details'
     2468                                        },
     2469                                        replaceParams = {
     2470                                                id: 'replace-' + type,
     2471                                                library: media.query( { type: type } ),
     2472                                                image: this[type],
     2473                                                multiple: false,
     2474                                                title: args.replaceTitle,
     2475                                                menu: type + '-details',
     2476                                                toolbar: 'replace',
     2477                                                priority:  80,
     2478                                                displaySettings: true
     2479                                        };
    23992480
    2400                 renderImageDetailsContent: function() {
    2401                         var view = new media.view.ImageDetails({
    2402                                 controller: this,
    2403                                 model: this.state().image,
    2404                                 attachment: this.state().image.attachment
    2405                         }).render();
     2481                                detailsParams[type] = this[type];
     2482                                replaceParams[type] = this[type];
    24062483
    2407                         this.content.set( view );
     2484                                this.states.add([
     2485                                        new media.controller[args.detailsController](detailsParams),
     2486                                        new media.controller[args.replaceController](replaceParams)
     2487                                ]);
     2488                        },
    24082489
    2409                 },
     2490                        renderDetailsContent: function() {
     2491                                var view = new media.view[args.detailsView]({
     2492                                        controller: this,
     2493                                        model: this.state()[type],
     2494                                        attachment: this.state()[type].attachment
     2495                                }).render();
    24102496
    2411                 renderMenu: function( view ) {
    2412                         var lastState = this.lastState(),
    2413                                 previous = lastState && lastState.id,
    2414                                 frame = this;
     2497                                this.content.set( view );
     2498                        },
    24152499
    2416                         view.set({
    2417                                 cancel: {
    2418                                         text:     l10n.imageDetailsCancel,
    2419                                         priority: 20,
    2420                                         click:    function() {
    2421                                                 if ( previous ) {
    2422                                                         frame.setState( previous );
    2423                                                 } else {
    2424                                                         frame.close();
     2500                        renderMenu: function( view ) {
     2501                                var lastState = this.lastState(),
     2502                                        previous = lastState && lastState.id,
     2503                                        frame = this;
     2504
     2505                                view.set({
     2506                                        cancel: {
     2507                                                text:     args.cancelText,
     2508                                                priority: 20,
     2509                                                click:    function() {
     2510                                                        if ( previous ) {
     2511                                                                frame.setState( previous );
     2512                                                        } else {
     2513                                                                frame.close();
     2514                                                        }
    24252515                                                }
    2426                                         }
    2427                                 },
    2428                                 separateCancel: new media.View({
    2429                                         className: 'separator',
    2430                                         priority: 40
    2431                                 })
    2432                         });
     2516                                        },
     2517                                        separateCancel: new media.View({
     2518                                                className: 'separator',
     2519                                                priority: 40
     2520                                        })
     2521                                });
    24332522
    2434                 },
     2523                        },
    24352524
    2436                 renderImageDetailsToolbar: function() {
    2437                         this.toolbar.set( new media.view.Toolbar({
    2438                                 controller: this,
    2439                                 items: {
    2440                                         select: {
    2441                                                 style:    'primary',
    2442                                                 text:     l10n.update,
    2443                                                 priority: 80,
     2525                        renderDetailsToolbar: function() {
     2526                                this.toolbar.set( new media.view.Toolbar({
     2527                                        controller: this,
     2528                                        items: {
     2529                                                select: {
     2530                                                        style:    'primary',
     2531                                                        text:     l10n.update,
     2532                                                        priority: 80,
    24442533
    2445                                                 click: function() {
    2446                                                         var controller = this.controller,
    2447                                                                 state = controller.state();
     2534                                                        click: function() {
     2535                                                                var controller = this.controller,
     2536                                                                        state = controller.state();
    24482537
    2449                                                         controller.close();
     2538                                                                controller.close();
    24502539
    2451                                                         // not sure if we want to use wp.media.string.image which will create a shortcode or
    2452                                                         // perhaps wp.html.string to at least to build the <img />
    2453                                                         state.trigger( 'update', controller.image.toJSON() );
     2540                                                                // not sure if we want to use wp.media.string.image which will create a shortcode or
     2541                                                                // perhaps wp.html.string to at least to build the <img />
     2542                                                                state.trigger( 'update', controller[type].toJSON() );
    24542543
    2455                                                         // Restore and reset the default state.
    2456                                                         controller.setState( controller.options.state );
    2457                                                         controller.reset();
     2544                                                                // Restore and reset the default state.
     2545                                                                controller.setState( controller.options.state );
     2546                                                                controller.reset();
     2547                                                        }
    24582548                                                }
    24592549                                        }
    2460                                 }
    2461                         }) );
    2462                 },
     2550                                }) );
     2551                        },
    24632552
    2464                 renderReplaceImageToolbar: function() {
    2465                         this.toolbar.set( new media.view.Toolbar({
    2466                                 controller: this,
    2467                                 items: {
    2468                                         replace: {
    2469                                                 style:    'primary',
    2470                                                 text:     l10n.replace,
    2471                                                 priority: 80,
     2553                        renderReplaceToolbar: function() {
     2554                                this.toolbar.set( new media.view.Toolbar({
     2555                                        controller: this,
     2556                                        items: {
     2557                                                replace: {
     2558                                                        style:    'primary',
     2559                                                        text:     l10n.replace,
     2560                                                        priority: 80,
    24722561
    2473                                                 click: function() {
    2474                                                         var controller = this.controller,
    2475                                                                 state = controller.state(),
    2476                                                                 selection = state.get( 'selection' ),
    2477                                                                 attachment = selection.single();
     2562                                                        click: function() {
     2563                                                                var controller = this.controller,
     2564                                                                        state = controller.state(),
     2565                                                                        selection = state.get( 'selection' ),
     2566                                                                        attachment = selection.single();
    24782567
    2479                                                         controller.close();
     2568                                                                if ( args.closeOnReplace ) {
     2569                                                                        controller.close();
     2570                                                                }
    24802571
    2481                                                         controller.image.changeAttachment( attachment, state.display( attachment ) );
     2572                                                                controller[type].changeAttachment( attachment, state.display( attachment ) );
    24822573
    2483                                                         // not sure if we want to use wp.media.string.image which will create a shortcode or
    2484                                                         // perhaps wp.html.string to at least to build the <img />
    2485                                                         state.trigger( 'replace', controller.image.toJSON() );
     2574                                                                // not sure if we want to use wp.media.string.image which will create a shortcode or
     2575                                                                // perhaps wp.html.string to at least to build the <img />
     2576                                                                state.trigger( 'replace', controller[type].toJSON() );
    24862577
    2487                                                         // Restore and reset the default state.
    2488                                                         controller.setState( controller.options.state );
    2489                                                         controller.reset();
     2578                                                                // Restore and reset the default state.
     2579                                                                controller.setState( controller.options.state );
     2580                                                                controller.reset();
     2581                                                        }
    24902582                                                }
    24912583                                        }
    2492                                 }
    2493                         }) );
    2494                 }
     2584                                }) );
     2585                        }
    24952586
    2496         });
     2587                });
     2588        };
    24972589
     2590        media.view.MediaFrame.ImageDetails = media.view.MediaFrame.MediaDetails( 'image', {
     2591                model: 'PostImage',
     2592                detailsView: 'ImageDetails',
     2593                detailsController: 'ImageDetails',
     2594                replaceController: 'ReplaceImage',
     2595                title : l10n.imageDetailsTitle,
     2596                replaceTitle: l10n.imageReplaceTitle,
     2597                cancelText: l10n.imageDetailsCancel,
     2598                closeOnReplace: true
     2599        } );
    24982600
     2601        media.view.MediaFrame.AudioDetails = media.view.MediaFrame.MediaDetails( 'audio', {
     2602                model: 'PostAudio',
     2603                detailsView: 'AudioDetails',
     2604                detailsController: 'AudioDetails',
     2605                replaceController: 'ReplaceAudio',
     2606                title : l10n.audioDetailsTitle,
     2607                replaceTitle: l10n.audioReplaceTitle,
     2608                cancelText: l10n.audioDetailsCancel,
     2609                closeOnReplace: false
     2610        } );
     2611
     2612        media.view.MediaFrame.VideoDetails = media.view.MediaFrame.MediaDetails( 'video', {
     2613                model: 'PostVideo',
     2614                detailsView: 'VideoDetails',
     2615                detailsController: 'VideoDetails',
     2616                replaceController: 'ReplaceVideo',
     2617                title : l10n.videoDetailsTitle,
     2618                replaceTitle: l10n.videoReplaceTitle,
     2619                cancelText: l10n.videoDetailsCancel,
     2620                closeOnReplace: false
     2621        } );
     2622
    24992623        /**
    25002624         * wp.media.view.Modal
    25012625         *
    … …  
    55115635         * @augments Backbone.View
    55125636         */
    55135637        media.view.EmbedImage =  media.view.Settings.AttachmentDisplay.extend({
    5514                 className: 'embed-image-settings',
     5638                className: 'embed-media-settings',
    55155639                template:  media.template('embed-image-settings'),
    55165640
    55175641                initialize: function() {
    … …  
    55275651                }
    55285652        });
    55295653
    5530         media.view.ImageDetails = media.view.Settings.AttachmentDisplay.extend({
    5531                 className: 'image-details',
    5532                 template:  media.template('image-details'),
     5654        /**
     5655         * @static
     5656         * @param {string} type
     5657         * @returns {wp.media.view.Settings.AttachmentDisplay}
     5658         */
     5659        media.view.MediaDetails = function (type) {
     5660                /**
     5661                 *
     5662                 * @contructor
     5663                 * @augments wp.media.view.Settings.AttachmentDisplay
     5664                 * @augments wp.media.view.Settings
     5665                 * @augments wp.media.View
     5666                 * @augments wp.Backbone.View
     5667                 * @augments Backbone.View
     5668                 */
     5669                return media.view.Settings.AttachmentDisplay.extend({
     5670                        className: type + '-details',
     5671                        template:  media.template(type + '-details'),
    55335672
    5534                 initialize: function() {
    5535                         // used in AttachmentDisplay.prototype.updateLinkTo
    5536                         this.options.attachment = this.model.attachment;
    5537                         media.view.Settings.AttachmentDisplay.prototype.initialize.apply( this, arguments );
    5538                 },
     5673                        initialize: function() {
     5674                                // used in AttachmentDisplay.prototype.updateLinkTo
     5675                                this.options.attachment = this.model.attachment;
     5676                                media.view.Settings.AttachmentDisplay.prototype.initialize.apply( this, arguments );
     5677                        },
    55395678
    5540                 prepare: function() {
    5541                         var attachment = false;
     5679                        prepare: function() {
     5680                                var attachment = false;
    55425681
    5543                         if ( this.model.attachment ) {
    5544                                 attachment = this.model.attachment.toJSON();
    5545                         }
    5546                         return _.defaults({
    5547                                 model: this.model.toJSON(),
    5548                                 attachment: attachment
    5549                         }, this.options );
    5550                 },
     5682                                if ( this.model.attachment ) {
     5683                                        attachment = this.model.attachment.toJSON();
     5684                                }
     5685                                return _.defaults({
     5686                                        model: this.model.toJSON(),
     5687                                        attachment: attachment
     5688                                }, this.options );
     5689                        },
    55515690
     5691                        render: function() {
     5692                                var self = this,
     5693                                        args = arguments;
     5694                                if ( this.model.attachment && this.model.dfd && 'pending' === this.model.dfd.state() ) {
     5695                                        // should instead show a spinner when the attachment is new and then add a listener that updates on change
     5696                                        this.model.dfd.done( function() {
     5697                                                media.view.Settings.AttachmentDisplay.prototype.render.apply( self, args );
     5698                                                self.resetFocus();
     5699                                        } );
     5700                                } else {
     5701                                        media.view.Settings.AttachmentDisplay.prototype.render.apply( this, arguments );
     5702                                        setTimeout( function() { self.resetFocus(); }, 10 );
     5703                                }
    55525704
    5553                 render: function() {
    5554                         var self = this,
    5555                                 args = arguments;
    5556                         if ( this.model.attachment && 'pending' === this.model.dfd.state() ) {
    5557                                 // should instead show a spinner when the attachment is new and then add a listener that updates on change
    5558                                 this.model.dfd.done( function() {
    5559                                         media.view.Settings.AttachmentDisplay.prototype.render.apply( self, args );
    5560                                         self.resetFocus();
    5561                                 } );
    5562                         } else {
    5563                                 media.view.Settings.AttachmentDisplay.prototype.render.apply( this, arguments );
    5564                                 setTimeout( function() { self.resetFocus(); }, 10 );
     5705                                return this;
     5706                        },
     5707
     5708                        resetFocus: function() {
     5709                                this.$( '.caption textarea' ).focus();
     5710                                this.$( '.embed-media-settings' ).scrollTop( 0 );
    55655711                        }
     5712                } );
     5713        };
    55665714
    5567                         return this;
    5568                 },
     5715        /**
     5716         * wp.media.view.ImageDetails
     5717         *
     5718         * @contructor
     5719         * @augments wp.media.view.Settings.AttachmentDisplay
     5720         * @augments wp.media.view.Settings
     5721         * @augments wp.media.View
     5722         * @augments wp.Backbone.View
     5723         * @augments Backbone.View
     5724         */
     5725        media.view.ImageDetails = media.view.MediaDetails( 'image' );
    55695726
    5570                 resetFocus: function() {
    5571                         this.$( '.caption textarea' ).focus();
    5572                         this.$( '.embed-image-settings' ).scrollTop( 0 );
    5573                 }
    5574         });
     5727        /**
     5728         * wp.media.view.AudioDetails
     5729         *
     5730         * @contructor
     5731         * @augments wp.media.view.Settings.AttachmentDisplay
     5732         * @augments wp.media.view.Settings
     5733         * @augments wp.media.View
     5734         * @augments wp.Backbone.View
     5735         * @augments Backbone.View
     5736         */
     5737        media.view.AudioDetails = media.view.MediaDetails( 'audio' );
     5738
     5739        /**
     5740         * wp.media.view.VideoDetails
     5741         *
     5742         * @contructor
     5743         * @augments wp.media.view.Settings.AttachmentDisplay
     5744         * @augments wp.media.view.Settings
     5745         * @augments wp.media.View
     5746         * @augments wp.Backbone.View
     5747         * @augments Backbone.View
     5748         */
     5749        media.view.VideoDetails = media.view.MediaDetails( 'video' );
    55755750}(jQuery));

  • src/wp-includes/js/tinymce/plugins/wpgallery/plugin.js

     
    5353        }
    5454
    5555        function editMedia( node ) {
    56                 var gallery, frame, data;
     56                var gallery, frame, data, shortcode;
    5757
    5858                if ( node.nodeName !== 'IMG' ) {
    5959                        return;
    … …  
    6464                        return;
    6565                }
    6666
     67                data = window.decodeURIComponent( editor.dom.getAttrib( node, 'data-wp-media' ) );
     68
    6769                // Make sure we've selected a gallery node.
    6870                if ( editor.dom.hasClass( node, 'wp-gallery' ) && wp.media.gallery ) {
    6971                        gallery = wp.media.gallery;
    70                         data = window.decodeURIComponent( editor.dom.getAttrib( node, 'data-wp-media' ) );
    7172                        frame = gallery.edit( data );
    7273
    7374                        frame.state('gallery-edit').on( 'update', function( selection ) {
    … …  
    7576                                editor.dom.setAttrib( node, 'data-wp-media', window.encodeURIComponent( shortcode ) );
    7677                        });
    7778                } else if ( editor.dom.hasClass( node, 'wp-playlist' ) && wp.media.playlist ) {
    78                         data = window.decodeURIComponent( editor.dom.getAttrib( node, 'data-wp-media' ) );
    7979                        frame = wp.media.playlist.edit( data );
    8080
    8181                        frame.state('playlist-edit').on( 'update', function( selection ) {
    … …  
    8383                                editor.dom.setAttrib( node, 'data-wp-media', window.encodeURIComponent( shortcode ) );
    8484                        });
    8585                } else if ( editor.dom.hasClass( node, 'wp-video-playlist' ) && wp.media['video-playlist'] ) {
    86                         data = window.decodeURIComponent( editor.dom.getAttrib( node, 'data-wp-media' ) );
    8786                        frame = wp.media['video-playlist'].edit( data );
    8887
    8988                        frame.state('video-playlist-edit').on( 'update', function( selection ) {
    … …  
    9089                                var shortcode = wp.media['video-playlist'].shortcode( selection ).string();
    9190                                editor.dom.setAttrib( node, 'data-wp-media', window.encodeURIComponent( shortcode ) );
    9291                        });
     92                } else if ( editor.dom.hasClass( node, 'wp-video' ) ) {
     93                        shortcode = wp.shortcode.next( 'video', data ).shortcode;
     94                        frame = wp.media({
     95                                frame: 'video',
     96                                state: 'video-details',
     97                                metadata: _.defaults(
     98                                        shortcode.attrs.named,
     99                                        wp.media.video.defaults
     100                                )
     101                        } );
     102                        frame.state( 'video-details' ).on( 'update replace', function ( selection ) {
     103                                var shortcode = wp.media.video.shortcode( selection );
     104                                editor.dom.setAttrib( node, 'data-wp-media', window.encodeURIComponent( shortcode ) );
     105                        } );
     106                        frame.open();
     107                } else if ( editor.dom.hasClass( node, 'wp-audio' ) ) {
     108                        shortcode = wp.shortcode.next( 'audio', data ).shortcode;
     109                        frame = wp.media({
     110                                frame: 'audio',
     111                                state: 'audio-details',
     112                                metadata: _.defaults(
     113                                        shortcode.attrs.named,
     114                                        wp.media.audio.defaults
     115                                )
     116                        });
     117                        frame.state( 'audio-details' ).on( 'update replace', function ( selection ) {
     118                                var shortcode = wp.media.audio.shortcode( selection );
     119                                editor.dom.setAttrib( node, 'data-wp-media', window.encodeURIComponent( shortcode ) );
     120                        } );
     121                        frame.open();
    93122                } else {
    94123                        // temp
    95                         window.console && window.console.log( 'Edit AV shortcode ' + window.decodeURIComponent( editor.dom.getAttrib( node, 'data-wp-media' ) ) );
     124                        window.console && window.console.log( 'Edit AV shortcode ' + data );
    96125                }
    97126        }
    98127

  • src/wp-includes/media-template.php

     
    556556        <script type="text/html" id="tmpl-image-details">
    557557                <?php // reusing .media-embed to pick up the styles for now ?>
    558558                <div class="media-embed">
    559                         <div class="embed-image-settings">
     559                        <div class="embed-media-settings">
    560560                                <div class="thumbnail">
    561561                                        <img src="{{ data.model.url }}" draggable="false" />
    562562                                </div>
    … …  
    649649                        </div>
    650650                </div>
    651651        </script>
     652
     653        <script type="text/html" id="tmpl-audio-details">
     654                <?php // reusing .media-embed to pick up the styles for now ?>
     655                <div class="media-embed">
     656                        <div class="embed-media-settings">
     657                                <# if ( data.model.src ) { #>
     658                                <label class="setting">
     659                                        <span>SRC</span>
     660                                        <input type="text" disabled="disabled" data-setting="src" value="{{{ data.model.src }}}" />
     661                                </label>
     662                                <# } #>
     663                                <?php
     664                                $default_types = wp_get_audio_extensions();
     665
     666                                foreach ( $default_types as $type ): ?>
     667                                <# if ( data.model.<?php echo $type ?> ) { #>
     668                                <label class="setting">
     669                                        <span><?php echo strtoupper( $type ) ?></span>
     670                                        <input type="text" disabled="disabled" data-setting="<?php echo $type ?>" value="{{{ data.model.<?php echo $type ?> }}}" />
     671                                </label>
     672                                <# } #>
     673                                <?php endforeach ?>
     674
     675                                <div class="setting preload">
     676                                        <span><?php _e( 'Preload' ); ?></span>
     677                                        <div class="button-group button-large" data-setting="preload">
     678                                                <button class="button" value="auto">
     679                                                        <?php esc_attr_e( 'Auto' ); ?>
     680                                                </button>
     681                                                <button class="button" value="metadata">
     682                                                        <?php esc_attr_e( 'Metadata' ); ?>
     683                                                </button>
     684                                                <button class="button active" value="none">
     685                                                        <?php esc_attr_e( 'None' ); ?>
     686                                                </button>
     687                                        </div>
     688                                </div>
     689
     690                                <label class="setting">
     691                                        <span><?php _e( 'Autoplay' ); ?></span>
     692                                        <input type="checkbox" data-setting="autoplay" />
     693                                </label>
     694
     695                                <label class="setting">
     696                                        <span><?php _e( 'Loop' ); ?></span>
     697                                        <input type="checkbox" data-setting="loop" />
     698                                </label>
     699                        </div>
     700                </div>
     701        </script>
     702
     703        <script type="text/html" id="tmpl-video-details">
     704                <?php // reusing .media-embed to pick up the styles for now ?>
     705                <div class="media-embed">
     706                        <div class="embed-media-settings">
     707                                <# if ( data.model.src ) { #>
     708                                <label class="setting">
     709                                        <span>SRC</span>
     710                                        <input type="text" disabled="disabled" data-setting="src" value="{{{ data.model.src }}}" />
     711                                </label>
     712                                <# } #>
     713                                <?php
     714                                $default_types = wp_get_video_extensions();
     715
     716                                foreach ( $default_types as $type ): ?>
     717                                <# if ( data.model.<?php echo $type ?> ) { #>
     718                                <label class="setting">
     719                                        <span><?php echo strtoupper( $type ) ?></span>
     720                                        <input type="text" disabled="disabled" data-setting="<?php echo $type ?>" value="{{{ data.model.<?php echo $type ?> }}}" />
     721                                </label>
     722                                <# } #>
     723                                <?php endforeach ?>
     724
     725                                <div class="setting preload">
     726                                        <span><?php _e( 'Preload' ); ?></span>
     727                                        <div class="button-group button-large" data-setting="preload">
     728                                                <button class="button" value="auto">
     729                                                        <?php esc_attr_e( 'Auto' ); ?>
     730                                                </button>
     731                                                <button class="button" value="metadata">
     732                                                        <?php esc_attr_e( 'Metadata' ); ?>
     733                                                </button>
     734                                                <button class="button active" value="none">
     735                                                        <?php esc_attr_e( 'None' ); ?>
     736                                                </button>
     737                                        </div>
     738                                </div>
     739
     740                                <label class="setting">
     741                                        <span><?php _e( 'Autoplay' ); ?></span>
     742                                        <input type="checkbox" data-setting="autoplay" />
     743                                </label>
     744
     745                                <label class="setting">
     746                                        <span><?php _e( 'Loop' ); ?></span>
     747                                        <input type="checkbox" data-setting="loop" />
     748                                </label>
     749                        </div>
     750                </div>
     751        </script>
    652752        <?php
    653753
    654754        /**

  • src/wp-includes/media.php

     
    23412341                'imageReplaceTitle'     => __( 'Replace Image' ),
    23422342                'imageDetailsCancel'    => __( 'Cancel Edit' ),
    23432343
     2344                // Edit Image
     2345                'audioDetailsTitle'     => __( 'Audio Details' ),
     2346                'audioReplaceTitle'     => __( 'Replace Audio' ),
     2347                'audioDetailsCancel'    => __( 'Cancel Edit' ),
     2348
     2349                // Edit Image
     2350                'videoDetailsTitle'     => __( 'Video Details' ),
     2351                'videoReplaceTitle'     => __( 'Replace Video' ),
     2352                'videoDetailsCancel'    => __( 'Cancel Edit' ),
     2353
    23442354                // Playlist
    23452355                'playlistDragInfo'    => __( 'Drag and drop to reorder tracks.' ),
    23462356                'createPlaylistTitle' => __( 'Create Playlist' ),