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.


Built from https://develop.svn.wordpress.org/trunk@27313


git-svn-id: http://core.svn.wordpress.org/trunk@27166 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Scott Taylor 2014-02-27 19:22:14 +00:00
parent f931929905
commit 45e748e57e
3 changed files with 181 additions and 272 deletions

View File

@ -2,13 +2,13 @@
// WordPress, TinyMCE, and Media // WordPress, TinyMCE, and Media
// ----------------------------- // -----------------------------
(function($){ (function($, _){
/** /**
* Stores the editors' `wp.media.controller.Frame` instances. * Stores the editors' `wp.media.controller.Frame` instances.
* *
* @static * @static
*/ */
var workflows = {}, cache = {}; var workflows = {};
/** /**
* wp.media.string * wp.media.string
@ -274,39 +274,35 @@
} }
}; };
/** wp.media.collection = function(attributes) {
* wp.media.collection var collections = {};
* @namespace
*/ return _.extend( attributes, {
wp.media.collection = { coerce: function ( attrs, key ) {
attachments : function ( prop, type ) { if ( 'undefined' === typeof attrs[ key ] && 'undefined' !== typeof this.defaults[ key ] ) {
/** attrs[ key ] = this.defaults[ key ];
* Retrieve attachments based on the properties of the passed shortcode } else if ( 'true' === attrs[ key ] ) {
* attrs[ key ] = true;
* @global wp.media.query } else if ( 'false' === attrs[ key ] ) {
* attrs[ key ] = false;
* @param {wp.shortcode} shortcode An instance of wp.shortcode(). }
* @returns {wp.media.model.Attachments} A Backbone.Collection containing return attrs[ key ];
* the media items belonging to a collection. },
* The 'prop' specified by the passed prop is a Backbone.Model
* containing the 'props' for the gallery. attachments: function( shortcode ) {
*/
return function( shortcode ) {
var shortcodeString = shortcode.string(), var shortcodeString = shortcode.string(),
result = cache[ shortcodeString ], result = collections[ shortcodeString ],
attrs, args, query, others; attrs, args, query, others, self = this;
delete cache[ shortcodeString ];
delete collections[ shortcodeString ];
if ( result ) { if ( result ) {
return result; return result;
} }
// Fill the default shortcode attributes. // Fill the default shortcode attributes.
attrs = _.defaults( shortcode.attrs.named, this.defaults ); attrs = _.defaults( shortcode.attrs.named, this.defaults );
args = _.pick( attrs, 'orderby', 'order' ); args = _.pick( attrs, 'orderby', 'order' );
args.type = type; args.type = this.type;
args.perPage = -1; args.perPage = -1;
// Mark the `orderby` override attribute. // Mark the `orderby` override attribute.
@ -318,16 +314,6 @@
attrs._orderbyRandom = true; attrs._orderbyRandom = true;
} }
if ( -1 !== jQuery.inArray( prop, ['playlist', 'video-playlist'] ) ) {
_.each(['tracknumbers', 'tracklist', 'images', 'artists'], function (setting) {
if ( 'undefined' === typeof attrs[setting] ) {
attrs['_' + setting] = wp.media[ prop ].defaults[ setting ];
} else if ( 'true' === attrs[setting] || true === attrs[setting] ) {
attrs['_' + setting] = true;
}
});
}
// Map the `orderby` attribute to the corresponding model property. // Map the `orderby` attribute to the corresponding model property.
if ( ! attrs.orderby || /^menu_order(?: ID)?$/i.test( attrs.orderby ) ) { if ( ! attrs.orderby || /^menu_order(?: ID)?$/i.test( attrs.orderby ) ) {
args.orderby = 'menuOrder'; args.orderby = 'menuOrder';
@ -352,21 +338,25 @@
// Collect the attributes that were not included in `args`. // Collect the attributes that were not included in `args`.
others = _.omit( attrs, 'id', 'ids', 'include', 'exclude', 'orderby', 'order' ); others = _.omit( attrs, 'id', 'ids', 'include', 'exclude', 'orderby', 'order' );
// Remove default attributes from the shortcode.
_.each( this.defaults, function( value, key ) {
others[ key ] = self.coerce( others, key );
});
query = wp.media.query( args ); query = wp.media.query( args );
query[ prop ] = new Backbone.Model( others ); query[ this.tag ] = new Backbone.Model( others );
return query; return query;
};
}, },
shortcodeAttrs : function ( prop, attachments ) { shortcode: function( attachments ) {
var props = attachments.props.toJSON(), var props = attachments.props.toJSON(),
attrs = _.pick( props, 'orderby', 'order', 'style' ); attrs = _.pick( props, 'orderby', 'order' ),
shortcode, clone, self = this;
if ( attachments[ prop ] ) { if ( attachments[this.tag] ) {
_.extend( attrs, attachments[ prop ].toJSON() ); _.extend( attrs, attachments[this.tag].toJSON() );
} }
// Convert all gallery shortcodes to use the `ids` property.
// Convert all collection shortcodes to use the `ids` property.
// Ignore `post__in` and `post__not_in`; the attachments in // Ignore `post__in` and `post__not_in`; the attachments in
// the collection will already reflect those properties. // the collection will already reflect those properties.
attrs.ids = attachments.pluck('id'); attrs.ids = attachments.pluck('id');
@ -375,8 +365,7 @@
if ( props.uploadedTo ) { if ( props.uploadedTo ) {
attrs.id = props.uploadedTo; attrs.id = props.uploadedTo;
} }
// Check if the gallery is randomly ordered.
// Check if the collection is randomly ordered.
delete attrs.orderby; delete attrs.orderby;
if ( attrs._orderbyRandom ) { if ( attrs._orderbyRandom ) {
@ -394,34 +383,40 @@
delete attrs.orderby; delete attrs.orderby;
} }
if ( -1 !== jQuery.inArray( prop, ['playlist', 'video-playlist'] ) ) {
_.each(['tracknumbers', 'tracklist', 'images', 'artists'], function (setting) {
if ( 'undefined' === typeof attrs[ '_' + setting ] ) {
attrs[ '_' + setting ] = wp.media[ prop ].defaults[ setting ];
}
if ( attrs['_' + setting] ) {
attrs[setting] = true;
} else {
attrs[setting] = false;
}
delete attrs['_' + setting];
});
}
// Remove default attributes from the shortcode. // Remove default attributes from the shortcode.
_.each( wp.media[prop].defaults, function( value, key ) { _.each( this.defaults, function( value, key ) {
attrs[ key ] = self.coerce( attrs, key );
if ( value === attrs[ key ] ) { if ( value === attrs[ key ] ) {
delete attrs[ key ]; delete attrs[ key ];
} }
}); });
return attrs;
shortcode = new wp.shortcode({
tag: this.tag,
attrs: attrs,
type: 'single'
});
// Use a cloned version of the gallery.
clone = new wp.media.model.Attachments( attachments.models, {
props: props
});
clone[ this.tag ] = attachments[ this.tag ];
collections[ shortcode.string() ] = clone;
return shortcode;
}, },
editSelection : function ( prop, shortcode ) { edit: function( content ) {
var defaultPostId = wp.media[ prop ].defaults.id, var shortcode = wp.shortcode.next( this.tag, content ),
defaultPostId = this.defaults.id,
attachments, selection; attachments, selection;
// Bail if we didn't match the shortcode or all of the content.
if ( ! shortcode || shortcode.content !== content ) {
return;
}
// Ignore the rest of the match object. // Ignore the rest of the match object.
shortcode = shortcode.shortcode; shortcode = shortcode.shortcode;
@ -429,14 +424,14 @@
shortcode.set( 'id', defaultPostId ); shortcode.set( 'id', defaultPostId );
} }
attachments = wp.media[ prop ].attachments( shortcode ); attachments = this.attachments( shortcode );
selection = new wp.media.model.Selection( attachments.models, { selection = new wp.media.model.Selection( attachments.models, {
props: attachments.props.toJSON(), props: attachments.props.toJSON(),
multiple: true multiple: true
}); });
selection[ prop ] = attachments[ prop ]; selection[ this.tag ] = attachments[ this.tag ];
// Fetch the query's attachments, and then break ties from the // Fetch the query's attachments, and then break ties from the
// query to allow for sorting. // query to allow for sorting.
@ -447,102 +442,30 @@
selection.props.unset('orderby'); selection.props.unset('orderby');
}); });
return selection;
},
/**
*
* @param {string} prop The shortcode slug
* @param {wp.media.model.Attachments} attachments
* @param {wp.shortcode} shortcode
* @returns {wp.shortcode}
*/
cacheShortcode : function ( prop, attachments, shortcode ) {
// Use a cloned version of the playlist.
var clone = new wp.media.model.Attachments( attachments.models, {
props: attachments.props.toJSON()
});
clone[ prop ] = attachments[ prop ];
cache[ shortcode.string() ] = clone;
return shortcode;
},
getEditFrame : function ( args ) {
// Destroy the previous gallery frame. // Destroy the previous gallery frame.
if ( this.frame ) { if ( this.frame ) {
this.frame.dispose(); this.frame.dispose();
} }
// Store the current gallery frame. // Store the current gallery frame.
this.frame = wp.media( _.extend( { this.frame = wp.media({
frame: 'post', frame: 'post',
state: this.tag + '-edit',
title: this.editTitle,
editing: true, editing: true,
multiple: true multiple: true,
}, args ) ).open(); selection: selection
}).open();
return this.frame; return this.frame;
}, }
instance : function ( prop, args ) {
return {
attachments: this.attachments( prop, args.type ),
/**
* Triggered when clicking 'Insert {label}' or 'Update {label}'
*
* @global wp.shortcode
* @global wp.media.model.Attachments
*
* @param {wp.media.model.Attachments} attachments A Backbone.Collection containing
* the media items belonging to a collection.
* The 'prop' specified by the passed prop is a Backbone.Model
* containing the 'props' for the gallery.
* @returns {wp.shortcode}
*/
shortcode: function( attachments ) {
var shortcode = new wp.shortcode({
tag: prop,
attrs: wp.media.collection.shortcodeAttrs( prop, attachments ),
type: 'single'
}); });
return wp.media.collection.cacheShortcode( prop, attachments, shortcode );
},
/**
* Triggered when double-clicking a collection shortcode placeholder
* in the editor
*
* @global wp.shortcode
* @global wp.media.model.Selection
* @global wp.media.view.l10n
*
* @param {string} content Content that is searched for possible
* shortcode markup matching the passed tag name,
*
* @this wp.media.{prop}
*
* @returns {wp.media.view.MediaFrame.Select} A media workflow.
*/
edit: function( content ) {
var shortcode = wp.shortcode.next( prop, content );
// Bail if we didn't match the shortcode or all of the content.
if ( ! shortcode || shortcode.content !== content ) {
return;
}
return wp.media.collection.getEditFrame( {
title: args.title,
state: prop + '-edit',
selection: wp.media.collection.editSelection( prop, shortcode )
} );
}
};
}
}; };
wp.media.gallery = (function() { wp.media.gallery = new wp.media.collection({
var gallery = { tag: 'gallery',
type : 'image',
editTitle : wp.media.view.l10n.editGalleryTitle,
defaults : { defaults : {
itemtag: 'dl', itemtag: 'dl',
icontag: 'dt', icontag: 'dt',
@ -554,16 +477,12 @@
id: wp.media.view.settings.post.id, id: wp.media.view.settings.post.id,
orderby : 'menu_order ID' orderby : 'menu_order ID'
} }
}; });
return _.extend(gallery, wp.media.collection.instance( 'gallery', { wp.media.playlist = new wp.media.collection({
type : 'image', tag: 'playlist',
title : wp.media.view.l10n.editGalleryTitle type : 'audio',
})); editTitle : wp.media.view.l10n.editPlaylistTitle,
}());
wp.media.playlist = (function() {
var playlist = {
defaults : { defaults : {
id: wp.media.view.settings.post.id, id: wp.media.view.settings.post.id,
style: 'light', style: 'light',
@ -572,16 +491,12 @@
images: true, images: true,
artists: true artists: true
} }
}; });
return _.extend(playlist, wp.media.collection.instance( 'playlist', { wp.media['video-playlist'] = new wp.media.collection( {
type : 'audio', tag: 'video-playlist',
title : wp.media.view.l10n.editPlaylistTitle type : 'video',
})); editTitle : wp.media.view.l10n.editVideoPlaylistTitle,
}());
wp.media['video-playlist'] = (function() {
var playlist = {
defaults : { defaults : {
id: wp.media.view.settings.post.id, id: wp.media.view.settings.post.id,
style: 'light', style: 'light',
@ -589,13 +504,7 @@
tracknumbers: false, tracknumbers: false,
images: true images: true
} }
}; } );
return _.extend(playlist, wp.media.collection.instance( 'video-playlist', {
type : 'video',
title : wp.media.view.l10n.editVideoPlaylistTitle
}));
}());
/** /**
* wp.media.featuredImage * wp.media.featuredImage
@ -1083,4 +992,4 @@
_.bindAll( wp.media.editor, 'open' ); _.bindAll( wp.media.editor, 'open' );
$( wp.media.editor.init ); $( wp.media.editor.init );
}(jQuery)); }(jQuery, _));

File diff suppressed because one or more lines are too long

View File

@ -432,32 +432,32 @@ function wp_print_media_templates() {
</label> </label>
<# <#
var playlist = 'playlist-edit' === data.controller.id, emptyModel = 'undefined' === typeof data.model.style; var playlist = 'playlist-edit' === data.controller.id, emptyModel = _.isEmpty(data.model);
#> #>
<label class="setting"> <label class="setting">
<span><?php _e( 'Show Tracklist' ); ?></span> <span><?php _e( 'Show Tracklist' ); ?></span>
<input type="checkbox" data-setting="_tracklist" <# if ( playlist && emptyModel ) { #> <input type="checkbox" data-setting="tracklist" <# if ( playlist && emptyModel ) { #>
checked="checked" checked="checked"
<# } #> /> <# } #> />
</label> </label>
<label class="setting"> <label class="setting">
<span><?php _e( 'Show Track Numbers' ); ?></span> <span><?php _e( 'Show Track Numbers' ); ?></span>
<input type="checkbox" data-setting="_tracknumbers" <# if ( playlist && emptyModel ) { #> <input type="checkbox" data-setting="tracknumbers" <# if ( playlist && emptyModel ) { #>
checked="checked" checked="checked"
<# } #> /> <# } #> />
</label> </label>
<label class="setting"> <label class="setting">
<span><?php _e( 'Show Artist Name in Tracklist' ); ?></span> <span><?php _e( 'Show Artist Name in Tracklist' ); ?></span>
<input type="checkbox" data-setting="_artists" <# if ( playlist && emptyModel ) { #> <input type="checkbox" data-setting="artists" <# if ( playlist && emptyModel ) { #>
checked="checked" checked="checked"
<# } #> /> <# } #> />
</label> </label>
<label class="setting"> <label class="setting">
<span><?php _e( 'Show Images' ); ?></span> <span><?php _e( 'Show Images' ); ?></span>
<input type="checkbox" data-setting="_images" <# if ( emptyModel ) { #> <input type="checkbox" data-setting="images" <# if ( emptyModel ) { #>
checked="checked" checked="checked"
<# } #> /> <# } #> />
</label> </label>