WordPress.org

Make WordPress Core

Changeset 27313


Ignore:
Timestamp:
02/27/2014 07:21:04 PM (7 years ago)
Author:
wonderboymusic
Message:

wp.media.collection should be its own civilized instantiable class, not a wrapper/factory. The class shall contain no reference to specific instances, and shall not try to grab static properties of itself. self, meet this.

See #26631.

Location:
trunk/src/wp-includes
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-includes/js/media-editor.js

    r27308 r27313  
    33// WordPress, TinyMCE, and Media
    44// -----------------------------
    5 (function($){
     5(function($, _){
    66    /**
    77     * Stores the editors' `wp.media.controller.Frame` instances.
     
    99     * @static
    1010     */
    11     var workflows = {}, cache = {};
     11    var workflows = {};
    1212
    1313    /**
     
    275275    };
    276276
    277     /**
    278      * wp.media.collection
    279      * @namespace
    280      */
    281     wp.media.collection = {
    282         attachments : function ( prop, type ) {
    283             /**
    284              * Retrieve attachments based on the properties of the passed shortcode
    285              *
    286              * @global wp.media.query
    287              *
    288              * @param {wp.shortcode} shortcode An instance of wp.shortcode().
    289              * @returns {wp.media.model.Attachments} A Backbone.Collection containing
    290              *      the media items belonging to a collection.
    291              *      The 'prop' specified by the passed prop is a Backbone.Model
    292              *          containing the 'props' for the gallery.
    293              */
    294             return function( shortcode ) {
     277    wp.media.collection = function(attributes) {
     278        var collections = {};
     279
     280        return _.extend( attributes, {
     281            coerce: function ( attrs, key ) {
     282                if ( 'undefined' === typeof attrs[ key ] && 'undefined' !== typeof this.defaults[ key ] ) {
     283                    attrs[ key ] = this.defaults[ key ];
     284                } else if ( 'true' === attrs[ key ] ) {
     285                    attrs[ key ] = true;
     286                } else if ( 'false' === attrs[ key ] ) {
     287                    attrs[ key ] = false;
     288                }
     289                return attrs[ key ];
     290            },
     291
     292            attachments: function( shortcode ) {
    295293                var shortcodeString = shortcode.string(),
    296                     result = cache[ shortcodeString ],
    297                     attrs, args, query, others;
    298 
    299                 delete cache[ shortcodeString ];
    300 
     294                    result = collections[ shortcodeString ],
     295                    attrs, args, query, others, self = this;
     296
     297                delete collections[ shortcodeString ];
    301298                if ( result ) {
    302299                    return result;
    303300                }
    304 
    305301                // Fill the default shortcode attributes.
    306302                attrs = _.defaults( shortcode.attrs.named, this.defaults );
    307303                args  = _.pick( attrs, 'orderby', 'order' );
    308304
    309                 args.type = type;
     305                args.type    = this.type;
    310306                args.perPage = -1;
    311307
     
    317313                if ( 'rand' === attrs.orderby ) {
    318314                    attrs._orderbyRandom = true;
    319                 }
    320 
    321                 if ( -1 !== jQuery.inArray( prop, ['playlist', 'video-playlist'] ) ) {
    322                     _.each(['tracknumbers', 'tracklist', 'images', 'artists'], function (setting) {
    323                         if ( 'undefined' === typeof attrs[setting] ) {
    324                             attrs['_' + setting] = wp.media[ prop ].defaults[ setting ];
    325                         } else if ( 'true' === attrs[setting] || true === attrs[setting] ) {
    326                             attrs['_' + setting] = true;
    327                         }
    328                     });
    329315                }
    330316
     
    353339                others = _.omit( attrs, 'id', 'ids', 'include', 'exclude', 'orderby', 'order' );
    354340
     341                // Remove default attributes from the shortcode.
     342                _.each( this.defaults, function( value, key ) {
     343                    others[ key ] = self.coerce( others, key );
     344                });
     345
    355346                query = wp.media.query( args );
    356                 query[ prop ] = new Backbone.Model( others );
     347                query[ this.tag ] = new Backbone.Model( others );
    357348                return query;
    358             };
    359         },
    360 
    361         shortcodeAttrs : function ( prop, attachments ) {
    362             var props = attachments.props.toJSON(),
    363                 attrs = _.pick( props, 'orderby', 'order', 'style' );
    364 
    365             if ( attachments[ prop ] ) {
    366                 _.extend( attrs, attachments[ prop ].toJSON() );
    367             }
    368 
    369             // Convert all collection shortcodes to use the `ids` property.
    370             // Ignore `post__in` and `post__not_in`; the attachments in
    371             // the collection will already reflect those properties.
    372             attrs.ids = attachments.pluck('id');
    373 
    374             // Copy the `uploadedTo` post ID.
    375             if ( props.uploadedTo ) {
    376                 attrs.id = props.uploadedTo;
    377             }
    378 
    379             // Check if the collection is randomly ordered.
    380             delete attrs.orderby;
    381 
    382             if ( attrs._orderbyRandom ) {
    383                 attrs.orderby = 'rand';
    384             } else if ( attrs._orderByField && attrs._orderByField != 'rand' ) {
    385                 attrs.orderby = attrs._orderByField;
    386             }
    387 
    388             delete attrs._orderbyRandom;
    389             delete attrs._orderByField;
    390 
    391             // If the `ids` attribute is set and `orderby` attribute
    392             // is the default value, clear it for cleaner output.
    393             if ( attrs.ids && 'post__in' === attrs.orderby ) {
     349            },
     350
     351            shortcode: function( attachments ) {
     352                var props = attachments.props.toJSON(),
     353                    attrs = _.pick( props, 'orderby', 'order' ),
     354                    shortcode, clone, self = this;
     355
     356                if ( attachments[this.tag] ) {
     357                    _.extend( attrs, attachments[this.tag].toJSON() );
     358                }
     359                // Convert all gallery shortcodes to use the `ids` property.
     360                // Ignore `post__in` and `post__not_in`; the attachments in
     361                // the collection will already reflect those properties.
     362                attrs.ids = attachments.pluck('id');
     363
     364                // Copy the `uploadedTo` post ID.
     365                if ( props.uploadedTo ) {
     366                    attrs.id = props.uploadedTo;
     367                }
     368                // Check if the gallery is randomly ordered.
    394369                delete attrs.orderby;
    395             }
    396 
    397             if ( -1 !== jQuery.inArray( prop, ['playlist', 'video-playlist'] ) ) {
    398                 _.each(['tracknumbers', 'tracklist', 'images', 'artists'], function (setting) {
    399                     if ( 'undefined' === typeof attrs[ '_' + setting ] ) {
    400                         attrs[ '_' + setting ] = wp.media[ prop ].defaults[ setting ];
     370
     371                if ( attrs._orderbyRandom ) {
     372                    attrs.orderby = 'rand';
     373                } else if ( attrs._orderByField && attrs._orderByField != 'rand' ) {
     374                    attrs.orderby = attrs._orderByField;
     375                }
     376
     377                delete attrs._orderbyRandom;
     378                delete attrs._orderByField;
     379
     380                // If the `ids` attribute is set and `orderby` attribute
     381                // is the default value, clear it for cleaner output.
     382                if ( attrs.ids && 'post__in' === attrs.orderby ) {
     383                    delete attrs.orderby;
     384                }
     385
     386                // Remove default attributes from the shortcode.
     387                _.each( this.defaults, function( value, key ) {
     388                    attrs[ key ] = self.coerce( attrs, key );
     389                    if ( value === attrs[ key ] ) {
     390                        delete attrs[ key ];
    401391                    }
    402 
    403                     if ( attrs['_' + setting] ) {
    404                         attrs[setting] = true;
    405                     } else {
    406                         attrs[setting] = false;
    407                     }
    408                     delete attrs['_' + setting];
    409                 });
    410             }
    411 
    412             // Remove default attributes from the shortcode.
    413             _.each( wp.media[prop].defaults, function( value, key ) {
    414                 if ( value === attrs[ key ] ) {
    415                     delete attrs[ key ];
    416                 }
    417             });
    418             return attrs;
    419         },
    420 
    421         editSelection : function ( prop, shortcode ) {
    422             var defaultPostId = wp.media[ prop ].defaults.id,
    423                 attachments, selection;
    424 
    425             // Ignore the rest of the match object.
    426             shortcode = shortcode.shortcode;
    427 
    428             if ( _.isUndefined( shortcode.get('id') ) && ! _.isUndefined( defaultPostId ) ) {
    429                 shortcode.set( 'id', defaultPostId );
    430             }
    431 
    432             attachments = wp.media[ prop ].attachments( shortcode );
    433 
    434             selection = new wp.media.model.Selection( attachments.models, {
    435                 props:    attachments.props.toJSON(),
    436                 multiple: true
    437             });
    438 
    439             selection[ prop ] = attachments[ prop ];
    440 
    441             // Fetch the query's attachments, and then break ties from the
    442             // query to allow for sorting.
    443             selection.more().done( function() {
    444                 // Break ties with the query.
    445                 selection.props.set({ query: false });
    446                 selection.unmirror();
    447                 selection.props.unset('orderby');
    448             });
    449 
    450             return selection;
    451         },
    452 
    453         /**
    454          *
    455          * @param {string} prop The shortcode slug
    456          * @param {wp.media.model.Attachments} attachments
    457          * @param {wp.shortcode} shortcode
    458          * @returns {wp.shortcode}
    459          */
    460         cacheShortcode : function ( prop, attachments, shortcode ) {
    461             // Use a cloned version of the playlist.
    462             var clone = new wp.media.model.Attachments( attachments.models, {
    463                 props: attachments.props.toJSON()
    464             });
    465             clone[ prop ] = attachments[ prop ];
    466             cache[ shortcode.string() ] = clone;
    467 
    468             return shortcode;
    469         },
    470 
    471         getEditFrame : function ( args ) {
    472             // Destroy the previous gallery frame.
    473             if ( this.frame ) {
    474                 this.frame.dispose();
    475             }
    476 
    477             // Store the current gallery frame.
    478             this.frame = wp.media( _.extend( {
    479                 frame:     'post',
    480                 editing:   true,
    481                 multiple:  true
    482             }, args ) ).open();
    483 
    484             return this.frame;
    485         },
    486 
    487         instance : function ( prop, args ) {
    488             return {
    489                 attachments: this.attachments( prop, args.type ),
    490                 /**
    491                  * Triggered when clicking 'Insert {label}' or 'Update {label}'
    492                  *
    493                  * @global wp.shortcode
    494                  * @global wp.media.model.Attachments
    495                  *
    496                  * @param {wp.media.model.Attachments} attachments A Backbone.Collection containing
    497                  *      the media items belonging to a collection.
    498                  *      The 'prop' specified by the passed prop is a Backbone.Model
    499                  *          containing the 'props' for the gallery.
    500                  * @returns {wp.shortcode}
    501                  */
    502                 shortcode: function( attachments ) {
    503                     var shortcode = new wp.shortcode({
    504                         tag: prop,
    505                         attrs: wp.media.collection.shortcodeAttrs( prop, attachments ),
    506                         type: 'single'
    507                     });
    508 
    509                     return wp.media.collection.cacheShortcode( prop, attachments, shortcode );
    510                 },
    511                 /**
    512                  * Triggered when double-clicking a collection shortcode placeholder
    513                  *   in the editor
    514                  *
    515                  * @global wp.shortcode
    516                  * @global wp.media.model.Selection
    517                  * @global wp.media.view.l10n
    518                  *
    519                  * @param {string} content Content that is searched for possible
    520                  *    shortcode markup matching the passed tag name,
    521                  *
    522                  * @this wp.media.{prop}
    523                  *
    524                  * @returns {wp.media.view.MediaFrame.Select} A media workflow.
    525                  */
    526                 edit: function( content ) {
    527                     var shortcode = wp.shortcode.next( prop, content );
    528 
    529                     // Bail if we didn't match the shortcode or all of the content.
    530                     if ( ! shortcode || shortcode.content !== content ) {
    531                         return;
    532                     }
    533 
    534                     return wp.media.collection.getEditFrame( {
    535                         title: args.title,
    536                         state: prop + '-edit',
    537                         selection:  wp.media.collection.editSelection( prop, shortcode )
    538                     } );
    539                 }
    540             };
     392                });
     393
     394                shortcode = new wp.shortcode({
     395                    tag:    this.tag,
     396                    attrs:  attrs,
     397                    type:   'single'
     398                });
     399
     400                // Use a cloned version of the gallery.
     401                clone = new wp.media.model.Attachments( attachments.models, {
     402                    props: props
     403                });
     404                clone[ this.tag ] = attachments[ this.tag ];
     405                collections[ shortcode.string() ] = clone;
     406
     407                return shortcode;
     408            },
     409
     410            edit: function( content ) {
     411                var shortcode = wp.shortcode.next( this.tag, content ),
     412                    defaultPostId = this.defaults.id,
     413                    attachments, selection;
     414
     415                // Bail if we didn't match the shortcode or all of the content.
     416                if ( ! shortcode || shortcode.content !== content ) {
     417                    return;
     418                }
     419
     420                // Ignore the rest of the match object.
     421                shortcode = shortcode.shortcode;
     422
     423                if ( _.isUndefined( shortcode.get('id') ) && ! _.isUndefined( defaultPostId ) ) {
     424                    shortcode.set( 'id', defaultPostId );
     425                }
     426
     427                attachments = this.attachments( shortcode );
     428
     429                selection = new wp.media.model.Selection( attachments.models, {
     430                    props:    attachments.props.toJSON(),
     431                    multiple: true
     432                });
     433
     434                selection[ this.tag ] = attachments[ this.tag ];
     435
     436                // Fetch the query's attachments, and then break ties from the
     437                // query to allow for sorting.
     438                selection.more().done( function() {
     439                    // Break ties with the query.
     440                    selection.props.set({ query: false });
     441                    selection.unmirror();
     442                    selection.props.unset('orderby');
     443                });
     444
     445                // Destroy the previous gallery frame.
     446                if ( this.frame ) {
     447                    this.frame.dispose();
     448                }
     449
     450                // Store the current gallery frame.
     451                this.frame = wp.media({
     452                    frame:     'post',
     453                    state:     this.tag + '-edit',
     454                    title:     this.editTitle,
     455                    editing:   true,
     456                    multiple:  true,
     457                    selection: selection
     458                }).open();
     459
     460                return this.frame;
     461            }
     462        });
     463    };
     464
     465    wp.media.gallery = new wp.media.collection({
     466        tag: 'gallery',
     467        type : 'image',
     468        editTitle : wp.media.view.l10n.editGalleryTitle,
     469        defaults : {
     470            itemtag: 'dl',
     471            icontag: 'dt',
     472            captiontag: 'dd',
     473            columns: '3',
     474            link: 'post',
     475            size: 'thumbnail',
     476            order: 'ASC',
     477            id: wp.media.view.settings.post.id,
     478            orderby : 'menu_order ID'
    541479        }
    542     };
    543 
    544     wp.media.gallery = (function() {
    545         var gallery = {
    546             defaults : {
    547                 itemtag: 'dl',
    548                 icontag: 'dt',
    549                 captiontag: 'dd',
    550                 columns: '3',
    551                 link: 'post',
    552                 size: 'thumbnail',
    553                 order: 'ASC',
    554                 id: wp.media.view.settings.post.id,
    555                 orderby : 'menu_order ID'
    556             }
    557         };
    558 
    559         return _.extend(gallery, wp.media.collection.instance( 'gallery', {
    560             type : 'image',
    561             title : wp.media.view.l10n.editGalleryTitle
    562         }));
    563     }());
    564 
    565     wp.media.playlist = (function() {
    566         var playlist = {
    567             defaults : {
    568                 id: wp.media.view.settings.post.id,
    569                 style: 'light',
    570                 tracklist: true,
    571                 tracknumbers: true,
    572                 images: true,
    573                 artists: true
    574             }
    575         };
    576 
    577         return _.extend(playlist, wp.media.collection.instance( 'playlist', {
    578             type : 'audio',
    579             title : wp.media.view.l10n.editPlaylistTitle
    580         }));
    581     }());
    582 
    583     wp.media['video-playlist'] = (function() {
    584         var playlist = {
    585             defaults : {
    586                 id: wp.media.view.settings.post.id,
    587                 style: 'light',
    588                 tracklist: false,
    589                 tracknumbers: false,
    590                 images: true
    591             }
    592         };
    593 
    594         return _.extend(playlist, wp.media.collection.instance( 'video-playlist', {
    595             type : 'video',
    596             title : wp.media.view.l10n.editVideoPlaylistTitle
    597         }));
    598     }());
     480    });
     481
     482    wp.media.playlist = new wp.media.collection({
     483        tag: 'playlist',
     484        type : 'audio',
     485        editTitle : wp.media.view.l10n.editPlaylistTitle,
     486        defaults : {
     487            id: wp.media.view.settings.post.id,
     488            style: 'light',
     489            tracklist: true,
     490            tracknumbers: true,
     491            images: true,
     492            artists: true
     493        }
     494    });
     495
     496    wp.media['video-playlist'] = new wp.media.collection( {
     497        tag: 'video-playlist',
     498        type : 'video',
     499        editTitle : wp.media.view.l10n.editVideoPlaylistTitle,
     500        defaults : {
     501            id: wp.media.view.settings.post.id,
     502            style: 'light',
     503            tracklist: false,
     504            tracknumbers: false,
     505            images: true
     506        }
     507    } );
    599508
    600509    /**
     
    1084993    _.bindAll( wp.media.editor, 'open' );
    1085994    $( wp.media.editor.init );
    1086 }(jQuery));
     995}(jQuery, _));
  • trunk/src/wp-includes/media-template.php

    r27242 r27313  
    433433
    434434        <#
    435             var playlist = 'playlist-edit' === data.controller.id, emptyModel = 'undefined' === typeof data.model.style;
     435            var playlist = 'playlist-edit' === data.controller.id, emptyModel = _.isEmpty(data.model);
    436436        #>
    437437        <label class="setting">
    438438            <span><?php _e( 'Show Tracklist' ); ?></span>
    439             <input type="checkbox" data-setting="_tracklist" <# if ( playlist && emptyModel ) { #>
     439            <input type="checkbox" data-setting="tracklist" <# if ( playlist && emptyModel ) { #>
    440440                checked="checked"
    441441            <# } #> />
     
    444444        <label class="setting">
    445445            <span><?php _e( 'Show Track Numbers' ); ?></span>
    446             <input type="checkbox" data-setting="_tracknumbers" <# if ( playlist && emptyModel ) { #>
     446            <input type="checkbox" data-setting="tracknumbers" <# if ( playlist && emptyModel ) { #>
    447447                checked="checked"
    448448            <# } #> />
     
    451451        <label class="setting">
    452452            <span><?php _e( 'Show Artist Name in Tracklist' ); ?></span>
    453             <input type="checkbox" data-setting="_artists" <# if ( playlist && emptyModel ) { #>
     453            <input type="checkbox" data-setting="artists" <# if ( playlist && emptyModel ) { #>
    454454                checked="checked"
    455455            <# } #> />
     
    458458        <label class="setting">
    459459            <span><?php _e( 'Show Images' ); ?></span>
    460             <input type="checkbox" data-setting="_images" <# if ( emptyModel ) { #>
     460            <input type="checkbox" data-setting="images" <# if ( emptyModel ) { #>
    461461                checked="checked"
    462462            <# } #> />
Note: See TracChangeset for help on using the changeset viewer.