Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
(function($){
|
|
|
|
var media = wp.media,
|
|
|
|
Attachment = media.model.Attachment,
|
|
|
|
Attachments = media.model.Attachments,
|
2012-09-27 03:11:04 +02:00
|
|
|
Query = media.model.Query,
|
|
|
|
l10n;
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
|
2012-09-27 03:11:04 +02:00
|
|
|
// Link any localized strings.
|
|
|
|
l10n = media.view.l10n = _.isUndefined( _wpMediaViewsL10n ) ? {} : _wpMediaViewsL10n;
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
|
|
|
|
/**
|
|
|
|
* ========================================================================
|
|
|
|
* CONTROLLERS
|
|
|
|
* ========================================================================
|
|
|
|
*/
|
|
|
|
|
|
|
|
/**
|
|
|
|
* wp.media.controller.Workflow
|
|
|
|
*/
|
|
|
|
media.controller.Workflow = Backbone.Model.extend({
|
|
|
|
defaults: {
|
2012-09-27 08:20:22 +02:00
|
|
|
title: '',
|
2012-09-26 23:40:02 +02:00
|
|
|
multiple: false,
|
|
|
|
view: 'library',
|
|
|
|
library: {},
|
|
|
|
selection: []
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
},
|
|
|
|
|
|
|
|
initialize: function() {
|
|
|
|
this.createSelection();
|
|
|
|
|
2012-09-11 23:13:07 +02:00
|
|
|
// Initialize view storage.
|
2012-09-26 23:40:02 +02:00
|
|
|
this._views = {};
|
|
|
|
this._pendingViews = {};
|
2012-09-11 23:13:07 +02:00
|
|
|
|
|
|
|
// Initialize modal container view.
|
|
|
|
this.modal = new media.view.Modal({ controller: this });
|
|
|
|
|
|
|
|
// Add default views.
|
2012-09-26 23:40:02 +02:00
|
|
|
//
|
|
|
|
// Use the `library` property to initialize the corresponding view,
|
|
|
|
// then unset the property.
|
|
|
|
this.add( 'library', media.view.Workspace.Library, {
|
|
|
|
collection: media.query( this.get('library') )
|
2012-10-10 11:30:22 +02:00
|
|
|
});
|
2012-09-26 23:40:02 +02:00
|
|
|
this.unset('library');
|
|
|
|
|
|
|
|
// Add the gallery view.
|
2012-10-10 11:30:22 +02:00
|
|
|
this.add( 'gallery', media.view.Workspace.Gallery, {
|
|
|
|
collection: this.selection
|
|
|
|
});
|
|
|
|
this.add( 'gallery-library', media.view.Workspace.Library.Gallery, {
|
|
|
|
collection: media.query({ type: 'image' })
|
|
|
|
});
|
2012-09-11 23:13:07 +02:00
|
|
|
},
|
|
|
|
|
|
|
|
|
2012-09-19 00:41:51 +02:00
|
|
|
// Registers a view.
|
2012-09-11 23:21:32 +02:00
|
|
|
//
|
2012-09-19 00:41:51 +02:00
|
|
|
// `id` is a unique ID for the view relative to the workflow instance.
|
|
|
|
// `constructor` is a `Backbone.View` constructor. `options` are the
|
|
|
|
// options to be passed when the view is initialized.
|
2012-09-11 23:13:07 +02:00
|
|
|
//
|
|
|
|
// Triggers the `add` and `add:VIEW_ID` events.
|
2012-09-19 00:41:51 +02:00
|
|
|
add: function( id, constructor, options ) {
|
2012-09-11 23:13:07 +02:00
|
|
|
this.remove( id );
|
2012-09-26 23:40:02 +02:00
|
|
|
this._pendingViews[ id ] = {
|
2012-09-19 00:41:51 +02:00
|
|
|
view: constructor,
|
|
|
|
options: options
|
|
|
|
};
|
|
|
|
this.trigger( 'add add:' + id, constructor, options );
|
2012-09-11 23:13:07 +02:00
|
|
|
return this;
|
|
|
|
},
|
|
|
|
|
|
|
|
// Returns a registered view instance. If an `id` is not provided,
|
|
|
|
// it will return the active view.
|
|
|
|
//
|
|
|
|
// Lazily instantiates a registered view.
|
|
|
|
//
|
|
|
|
// Triggers the `init` and `init:VIEW_ID` events.
|
|
|
|
view: function( id ) {
|
|
|
|
var pending;
|
|
|
|
|
|
|
|
id = id || this.get('view');
|
2012-09-26 23:40:02 +02:00
|
|
|
pending = this._pendingViews[ id ];
|
2012-09-11 23:13:07 +02:00
|
|
|
|
|
|
|
if ( ! this._views[ id ] && pending ) {
|
|
|
|
this._views[ id ] = new pending.view( _.extend({ controller: this }, pending.options || {} ) );
|
2012-09-26 23:40:02 +02:00
|
|
|
delete this._pendingViews[ id ];
|
2012-09-11 23:13:07 +02:00
|
|
|
this.trigger( 'init init:' + id, this._views[ id ] );
|
|
|
|
}
|
|
|
|
|
|
|
|
return this._views[ id ];
|
|
|
|
},
|
|
|
|
|
|
|
|
// Unregisters a view from the workflow.
|
|
|
|
//
|
|
|
|
// Triggers the `remove` and `remove:VIEW_ID` events.
|
|
|
|
remove: function( id ) {
|
|
|
|
delete this._views[ id ];
|
2012-09-26 23:40:02 +02:00
|
|
|
delete this._pendingViews[ id ];
|
2012-09-11 23:13:07 +02:00
|
|
|
this.trigger( 'remove remove:' + id );
|
|
|
|
return this;
|
|
|
|
},
|
|
|
|
|
|
|
|
// Renders a view and places it within the modal window.
|
2012-09-19 00:59:57 +02:00
|
|
|
// Automatically adds a view if `constructor` is provided.
|
|
|
|
render: function( id, constructor, options ) {
|
2012-09-11 23:13:07 +02:00
|
|
|
var view;
|
|
|
|
id = id || this.get('view');
|
|
|
|
|
2012-09-19 00:59:57 +02:00
|
|
|
if ( constructor )
|
|
|
|
this.add( id, constructor, options );
|
2012-09-11 23:13:07 +02:00
|
|
|
|
|
|
|
view = this.view( id );
|
|
|
|
|
|
|
|
if ( ! view )
|
2012-09-26 23:40:02 +02:00
|
|
|
return this;
|
2012-09-11 23:13:07 +02:00
|
|
|
|
|
|
|
view.render();
|
|
|
|
this.modal.content( view );
|
|
|
|
return this;
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
},
|
|
|
|
|
Use the new media modal to insert galleries into TinyMCE and the text editor.
'''Galleries'''
* Gallery insertion from the new media modal (into TinyMCE, the text editor, etc).
* Gallery previews in TinyMCE now use the `wp.mce.views` API.
* Disables the TinyMCE `wpgallery` plugin.
* Gallery previews consist of the first image of the gallery and the appearance of a stack. This will later be fleshed out to include more images/functionality (including editing the gallery, gallery properties, and showing the number of images in the gallery).
* Multiple galleries can be added to a single post.
* The gallery MCE view provides a bridge between the `wp.shortcode` and `Attachments` representation of a gallery, which allows the existing collection to persist when a gallery is initially created (preventing a request to the server for the query).
'''Shortcodes'''
* Renames `wp.shortcode.Match` to `wp.shortcode` to better expose the shortcode constructor.
* The `wp.shortcode` constructor now accepts an object of options instead of a `wp.shortcode.regexp()` match.
* A `wp.shortcode` instance can be created from a `wp.shortcode.regexp()` match by calling `wp.shortcode.fromMatch( match )`.
* Adds `wp.shortcode.string()`, which takes a set of shortcode parameters and converts them into a string.* Renames `wp.shortcode.prototype.text()` to `wp.shortcode.prototype.string()`.
* Adds an additional capture group to `wp.shortcode.regexp()` that records whether or not the shortcode has a closing tag. This allows us to improve the accuracy of the syntax used when transforming a shortcode object back into a string.
'''Media Models'''
* Prevents media `Query` models from observing the central `Attachments.all` object when query args without corresponding filters are set (otherwise, queries quickly amass false positives).
* Adds `post__in`, `post__not_in`, and `post_parent` as acceptable JS attachment `Query` args.
* `Attachments.more()` always returns a `$.promise` object.
see #21390, #21809, #21812, #21815, #21817.
git-svn-id: http://core.svn.wordpress.org/trunk@22120 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-10-05 06:23:59 +02:00
|
|
|
update: function( event ) {
|
2012-09-27 06:09:43 +02:00
|
|
|
this.close();
|
2012-10-10 10:31:12 +02:00
|
|
|
this.trigger( 'update', this.selection, this );
|
|
|
|
this.trigger( 'update:' + event, this.selection, this );
|
2012-09-27 06:09:43 +02:00
|
|
|
this.selection.clear();
|
|
|
|
},
|
|
|
|
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
createSelection: function() {
|
|
|
|
var controller = this;
|
|
|
|
|
|
|
|
// Initialize workflow-specific models.
|
2012-09-26 23:40:02 +02:00
|
|
|
// Use the `selection` property to initialize the Attachments
|
|
|
|
// collection, then unset the property.
|
|
|
|
this.selection = new Attachments( this.get('selection') );
|
|
|
|
this.unset('selection');
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
|
|
|
|
_.extend( this.selection, {
|
|
|
|
// Override the selection's add method.
|
|
|
|
// If the workflow does not support multiple
|
|
|
|
// selected attachments, reset the selection.
|
|
|
|
add: function( models, options ) {
|
|
|
|
if ( ! controller.get('multiple') ) {
|
|
|
|
models = _.isArray( models ) ? _.first( models ) : models;
|
|
|
|
this.clear( options );
|
|
|
|
}
|
|
|
|
|
|
|
|
return Attachments.prototype.add.call( this, models, options );
|
|
|
|
},
|
|
|
|
|
|
|
|
// Removes all models from the selection.
|
|
|
|
clear: function( options ) {
|
|
|
|
return this.remove( this.models, options );
|
|
|
|
},
|
|
|
|
|
|
|
|
// Override the selection's reset method.
|
|
|
|
// Always direct items through add and remove,
|
|
|
|
// as we need them to fire.
|
|
|
|
reset: function( models, options ) {
|
|
|
|
return this.clear( options ).add( models, options );
|
|
|
|
},
|
|
|
|
|
|
|
|
// Create selection.has, which determines if a model
|
|
|
|
// exists in the collection based on cid and id,
|
|
|
|
// instead of direct comparison.
|
|
|
|
has: function( attachment ) {
|
|
|
|
return !! ( this.getByCid( attachment.cid ) || this.get( attachment.id ) );
|
|
|
|
}
|
|
|
|
});
|
2012-09-11 23:13:07 +02:00
|
|
|
}
|
|
|
|
});
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
|
2012-09-11 23:13:07 +02:00
|
|
|
// Map modal methods to the workflow.
|
|
|
|
_.each(['attach','detach','open','close'], function( method ) {
|
|
|
|
media.controller.Workflow.prototype[ method ] = function() {
|
|
|
|
this.modal[ method ].apply( this.modal, arguments );
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
return this;
|
2012-09-11 23:13:07 +02:00
|
|
|
};
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
});
|
|
|
|
|
|
|
|
/**
|
|
|
|
* ========================================================================
|
|
|
|
* VIEWS
|
|
|
|
* ========================================================================
|
|
|
|
*/
|
|
|
|
|
|
|
|
/**
|
|
|
|
* wp.media.view.Modal
|
|
|
|
*/
|
|
|
|
media.view.Modal = Backbone.View.extend({
|
|
|
|
tagName: 'div',
|
|
|
|
template: media.template('media-modal'),
|
|
|
|
|
|
|
|
events: {
|
|
|
|
'click .media-modal-backdrop, .media-modal-close' : 'closeHandler'
|
|
|
|
},
|
|
|
|
|
|
|
|
initialize: function() {
|
|
|
|
this.controller = this.options.controller;
|
2012-09-27 08:20:22 +02:00
|
|
|
this.controller.on( 'change:title', this.render, this );
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
|
|
|
|
_.defaults( this.options, {
|
|
|
|
container: document.body
|
|
|
|
});
|
|
|
|
},
|
|
|
|
|
|
|
|
render: function() {
|
2012-09-06 11:19:03 +02:00
|
|
|
// Ensure content div exists.
|
|
|
|
this.options.$content = this.options.$content || $('<div />');
|
|
|
|
|
|
|
|
// Detach the content element from the DOM to prevent
|
|
|
|
// `this.$el.html()` from garbage collecting its events.
|
|
|
|
this.options.$content.detach();
|
|
|
|
|
2012-09-27 08:20:22 +02:00
|
|
|
this.$el.html( this.template( this.controller.toJSON() ) );
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
this.$('.media-modal-content').append( this.options.$content );
|
|
|
|
return this;
|
|
|
|
},
|
|
|
|
|
|
|
|
attach: function() {
|
|
|
|
this.$el.appendTo( this.options.container );
|
2012-10-10 10:31:12 +02:00
|
|
|
this.controller.trigger( 'attach', this.controller );
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
},
|
|
|
|
|
|
|
|
detach: function() {
|
|
|
|
this.$el.detach();
|
2012-10-10 10:31:12 +02:00
|
|
|
this.controller.trigger( 'detach', this.controller );
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
},
|
|
|
|
|
|
|
|
open: function() {
|
|
|
|
this.$el.show();
|
2012-10-10 10:31:12 +02:00
|
|
|
this.controller.trigger( 'open', this.controller );
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
},
|
|
|
|
|
|
|
|
close: function() {
|
|
|
|
this.$el.hide();
|
2012-10-10 10:31:12 +02:00
|
|
|
this.controller.trigger( 'close', this.controller );
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
},
|
|
|
|
|
|
|
|
closeHandler: function( event ) {
|
|
|
|
event.preventDefault();
|
|
|
|
this.close();
|
|
|
|
},
|
|
|
|
|
|
|
|
content: function( $content ) {
|
2012-09-19 02:34:00 +02:00
|
|
|
// Detach any existing content to prevent events from being lost.
|
|
|
|
if ( this.options.$content )
|
|
|
|
this.options.$content.detach();
|
|
|
|
|
|
|
|
// Set and render the content.
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
this.options.$content = ( $content instanceof Backbone.View ) ? $content.$el : $content;
|
|
|
|
return this.render();
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
2012-09-06 09:46:15 +02:00
|
|
|
/**
|
|
|
|
* wp.media.view.Toolbar
|
|
|
|
*/
|
|
|
|
media.view.Toolbar = Backbone.View.extend({
|
|
|
|
tagName: 'div',
|
|
|
|
className: 'media-toolbar',
|
|
|
|
|
|
|
|
initialize: function() {
|
|
|
|
this._views = {};
|
|
|
|
this.$primary = $('<div class="media-toolbar-primary" />').prependTo( this.$el );
|
|
|
|
this.$secondary = $('<div class="media-toolbar-secondary" />').prependTo( this.$el );
|
|
|
|
|
|
|
|
if ( this.options.items ) {
|
|
|
|
_.each( this.options.items, function( view, id ) {
|
|
|
|
this.add( id, view, { silent: true } );
|
|
|
|
}, this );
|
|
|
|
this.render();
|
|
|
|
}
|
|
|
|
},
|
|
|
|
|
|
|
|
render: function() {
|
|
|
|
var views = _.chain( this._views ).sortBy( function( view ) {
|
|
|
|
return view.options.priority || 10;
|
|
|
|
}).groupBy( function( view ) {
|
|
|
|
return ( view.options.priority || 10 ) > 0 ? 'primary' : 'secondary';
|
|
|
|
}).value();
|
|
|
|
|
|
|
|
// Make sure to detach the elements we want to reuse.
|
|
|
|
// Otherwise, `jQuery.html()` will unbind their events.
|
|
|
|
$( _.pluck( this._views, 'el' ) ).detach();
|
2012-10-10 10:31:12 +02:00
|
|
|
this.$primary.html( _.pluck( views.primary || [], 'el' ) );
|
|
|
|
this.$secondary.html( _.pluck( views.secondary || [], 'el' ) );
|
2012-09-06 09:46:15 +02:00
|
|
|
|
|
|
|
return this;
|
|
|
|
},
|
|
|
|
|
|
|
|
add: function( id, view, options ) {
|
|
|
|
if ( ! ( view instanceof Backbone.View ) ) {
|
|
|
|
view.classes = [ id ].concat( view.classes || [] );
|
|
|
|
view = new media.view.Button( view ).render();
|
|
|
|
}
|
|
|
|
|
|
|
|
this._views[ id ] = view;
|
|
|
|
if ( ! options || ! options.silent )
|
|
|
|
this.render();
|
|
|
|
return this;
|
|
|
|
},
|
|
|
|
|
2012-09-27 02:59:04 +02:00
|
|
|
get: function( id ) {
|
|
|
|
return this._views[ id ];
|
|
|
|
},
|
|
|
|
|
2012-09-06 09:46:15 +02:00
|
|
|
remove: function( id, options ) {
|
|
|
|
delete this._views[ id ];
|
|
|
|
if ( ! options || ! options.silent )
|
|
|
|
this.render();
|
|
|
|
return this;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
* wp.media.view.Button
|
|
|
|
*/
|
|
|
|
media.view.Button = Backbone.View.extend({
|
|
|
|
tagName: 'a',
|
|
|
|
className: 'media-button',
|
|
|
|
attributes: { href: '#' },
|
|
|
|
|
|
|
|
events: {
|
|
|
|
'click': 'click'
|
|
|
|
},
|
|
|
|
|
2012-09-27 02:59:04 +02:00
|
|
|
defaults: {
|
|
|
|
text: '',
|
|
|
|
style: '',
|
|
|
|
size: 'large'
|
|
|
|
},
|
|
|
|
|
2012-09-06 09:46:15 +02:00
|
|
|
initialize: function() {
|
2012-09-27 02:59:04 +02:00
|
|
|
// Create a model with the provided `defaults`.
|
|
|
|
this.model = new Backbone.Model( this.defaults );
|
|
|
|
|
|
|
|
// If any of the `options` have a key from `defaults`, apply its
|
|
|
|
// value to the `model` and remove it from the `options object.
|
|
|
|
_.each( this.defaults, function( def, key ) {
|
|
|
|
var value = this.options[ key ];
|
|
|
|
if ( _.isUndefined( value ) )
|
|
|
|
return;
|
|
|
|
|
|
|
|
this.model.set( key, value );
|
|
|
|
delete this.options[ key ];
|
|
|
|
}, this );
|
|
|
|
|
|
|
|
this.model.on( 'change', this.render, this );
|
2012-09-06 09:46:15 +02:00
|
|
|
},
|
|
|
|
|
|
|
|
render: function() {
|
2012-09-19 02:34:00 +02:00
|
|
|
var classes = [ 'button', this.className ];
|
2012-09-06 09:46:15 +02:00
|
|
|
|
2012-09-27 02:59:04 +02:00
|
|
|
if ( this.model.get('style') )
|
|
|
|
classes.push( 'button-' + this.model.get('style') );
|
2012-09-06 09:46:15 +02:00
|
|
|
|
2012-09-27 02:59:04 +02:00
|
|
|
if ( this.model.get('size') )
|
|
|
|
classes.push( 'button-' + this.model.get('size') );
|
2012-09-19 02:34:00 +02:00
|
|
|
|
2012-09-06 09:46:15 +02:00
|
|
|
classes = classes.concat( this.options.classes );
|
|
|
|
this.el.className = classes.join(' ');
|
2012-09-27 02:59:04 +02:00
|
|
|
|
|
|
|
this.$el.text( this.model.get('text') );
|
2012-09-06 09:46:15 +02:00
|
|
|
return this;
|
|
|
|
},
|
|
|
|
|
|
|
|
click: function( event ) {
|
|
|
|
event.preventDefault();
|
|
|
|
if ( this.options.click )
|
|
|
|
this.options.click.apply( this, arguments );
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
2012-09-27 08:53:54 +02:00
|
|
|
/**
|
|
|
|
* wp.media.view.Attachment
|
|
|
|
*/
|
|
|
|
media.view.Attachment = Backbone.View.extend({
|
|
|
|
tagName: 'li',
|
|
|
|
className: 'attachment',
|
|
|
|
template: media.template('attachment'),
|
|
|
|
|
|
|
|
events: {
|
2012-10-11 01:32:48 +02:00
|
|
|
'click .attachment-preview': 'toggleSelection',
|
|
|
|
'mouseenter .attachment-preview': 'shrink',
|
|
|
|
'mouseleave .attachment-preview': 'expand',
|
|
|
|
'change .describe': 'describe'
|
2012-09-27 08:53:54 +02:00
|
|
|
},
|
|
|
|
|
2012-09-27 09:45:26 +02:00
|
|
|
buttons: {},
|
|
|
|
|
2012-09-27 08:53:54 +02:00
|
|
|
initialize: function() {
|
|
|
|
this.controller = this.options.controller;
|
|
|
|
|
|
|
|
this.model.on( 'change:sizes change:uploading', this.render, this );
|
|
|
|
this.model.on( 'change:percent', this.progress, this );
|
|
|
|
this.model.on( 'add', this.select, this );
|
|
|
|
this.model.on( 'remove', this.deselect, this );
|
2012-09-27 09:45:26 +02:00
|
|
|
|
|
|
|
// Prevent default navigation on all links.
|
|
|
|
this.$el.on( 'click', 'a', this.preventDefault );
|
2012-09-27 08:53:54 +02:00
|
|
|
},
|
|
|
|
|
|
|
|
render: function() {
|
|
|
|
var attachment = this.model.toJSON(),
|
2012-10-10 11:55:47 +02:00
|
|
|
options = _.defaults( this.model.toJSON(), {
|
|
|
|
orientation: 'landscape',
|
|
|
|
uploading: false,
|
2012-10-10 12:08:43 +02:00
|
|
|
type: '',
|
2012-10-10 12:45:01 +02:00
|
|
|
subtype: '',
|
|
|
|
icon: '',
|
2012-10-11 01:55:45 +02:00
|
|
|
filename: '',
|
|
|
|
caption: '',
|
|
|
|
title: ''
|
2012-10-10 11:55:47 +02:00
|
|
|
});
|
2012-09-27 08:53:54 +02:00
|
|
|
|
2012-10-11 01:32:48 +02:00
|
|
|
options.buttons = this.buttons;
|
|
|
|
options.describe = this.controller.get('describe');
|
2012-10-09 01:20:04 +02:00
|
|
|
|
2012-10-10 11:55:47 +02:00
|
|
|
if ( 'image' === options.type )
|
2012-10-09 01:20:04 +02:00
|
|
|
_.extend( options, this.crop() );
|
2012-09-27 08:53:54 +02:00
|
|
|
|
|
|
|
this.$el.html( this.template( options ) );
|
|
|
|
|
2012-10-10 11:55:47 +02:00
|
|
|
if ( options.uploading )
|
2012-09-27 08:53:54 +02:00
|
|
|
this.$bar = this.$('.media-progress-bar div');
|
|
|
|
else
|
|
|
|
delete this.$bar;
|
|
|
|
|
|
|
|
// Check if the model is selected.
|
|
|
|
if ( this.controller.selection.has( this.model ) )
|
|
|
|
this.select();
|
|
|
|
|
|
|
|
return this;
|
|
|
|
},
|
|
|
|
|
|
|
|
progress: function() {
|
|
|
|
if ( this.$bar && this.$bar.length )
|
|
|
|
this.$bar.width( this.model.get('percent') + '%' );
|
|
|
|
},
|
|
|
|
|
|
|
|
toggleSelection: function( event ) {
|
|
|
|
var selection = this.controller.selection;
|
|
|
|
selection[ selection.has( this.model ) ? 'remove' : 'add' ]( this.model );
|
|
|
|
},
|
|
|
|
|
|
|
|
select: function( model, collection ) {
|
|
|
|
// If a collection is provided, check if it's the selection.
|
|
|
|
// If it's not, bail; we're in another selection's event loop.
|
|
|
|
if ( collection && collection !== this.controller.selection )
|
|
|
|
return;
|
|
|
|
|
|
|
|
this.$el.addClass('selected');
|
|
|
|
},
|
|
|
|
|
|
|
|
deselect: function( model, collection ) {
|
|
|
|
// If a collection is provided, check if it's the selection.
|
|
|
|
// If it's not, bail; we're in another selection's event loop.
|
|
|
|
if ( collection && collection !== this.controller.selection )
|
|
|
|
return;
|
|
|
|
|
|
|
|
this.$el.removeClass('selected');
|
2012-09-27 09:45:26 +02:00
|
|
|
},
|
|
|
|
|
|
|
|
preventDefault: function( event ) {
|
|
|
|
event.preventDefault();
|
2012-10-09 01:20:04 +02:00
|
|
|
},
|
|
|
|
|
|
|
|
imageSize: function( size ) {
|
|
|
|
var sizes = this.model.get('sizes');
|
|
|
|
|
|
|
|
size = size || 'medium';
|
|
|
|
|
|
|
|
// Use the provided image size if possible.
|
|
|
|
if ( sizes && sizes[ size ] ) {
|
|
|
|
return sizes[ size ];
|
|
|
|
} else {
|
|
|
|
return {
|
|
|
|
url: this.model.get('url'),
|
|
|
|
width: this.model.get('width'),
|
|
|
|
height: this.model.get('height'),
|
|
|
|
orientation: this.model.get('orientation')
|
|
|
|
};
|
|
|
|
}
|
|
|
|
},
|
|
|
|
|
|
|
|
crop: function( sizeId ) {
|
|
|
|
var edge = 199,
|
|
|
|
size = this.imageSize( sizeId ),
|
|
|
|
wide, tall;
|
|
|
|
|
|
|
|
wide = wp.media.fit( _.extend( { maxWidth: edge }, size ) );
|
|
|
|
tall = wp.media.fit( _.extend( { maxHeight: edge }, size ) );
|
|
|
|
|
|
|
|
_.extend( size, wide.width > tall.width ? wide : tall );
|
|
|
|
|
|
|
|
size.top = ( edge - size.height ) / 2;
|
|
|
|
size.left = ( edge - size.width ) / 2;
|
|
|
|
return size;
|
|
|
|
},
|
|
|
|
|
|
|
|
fit: function( sizeId ) {
|
|
|
|
var margin = 10,
|
|
|
|
full = 199,
|
|
|
|
edge = full - ( margin * 2 ),
|
|
|
|
size = _.extend( wp.media.fit( _.extend({
|
|
|
|
maxWidth: edge,
|
|
|
|
maxHeight: edge
|
|
|
|
}, this.imageSize( sizeId ) ) ) );
|
|
|
|
|
|
|
|
size.top = Math.round( margin + ( edge - size.height ) / 2 );
|
|
|
|
size.left = Math.round( margin + ( edge - size.width ) / 2 );
|
|
|
|
return size;
|
|
|
|
},
|
|
|
|
|
|
|
|
shrink: function() {
|
|
|
|
var size = _.pick( this.fit(), 'top', 'left', 'width', 'height' );
|
|
|
|
this.$el.addClass('fit');
|
|
|
|
this.$('.thumbnail').css( size );
|
2012-10-09 04:07:09 +02:00
|
|
|
this.$('.thumbnail img').css( _.extend( size, {
|
|
|
|
top: 0,
|
|
|
|
left: 0
|
|
|
|
} ) );
|
2012-10-09 01:20:04 +02:00
|
|
|
},
|
|
|
|
|
|
|
|
expand: function() {
|
|
|
|
var size = _.pick( this.crop(), 'top', 'left', 'width', 'height' );
|
|
|
|
this.$el.removeClass('fit');
|
|
|
|
this.$('.thumbnail img').css( size );
|
2012-10-09 04:07:09 +02:00
|
|
|
this.$('.thumbnail').css({
|
|
|
|
top: 0,
|
|
|
|
left: 0,
|
|
|
|
width: 199,
|
|
|
|
height: 199
|
|
|
|
});
|
2012-10-11 01:32:48 +02:00
|
|
|
},
|
|
|
|
|
|
|
|
describe: function( event ) {
|
|
|
|
if ( 'image' === this.model.get('type') )
|
|
|
|
this.model.save( 'caption', event.target.value );
|
|
|
|
else
|
|
|
|
this.model.save( 'title', event.target.value );
|
2012-09-27 08:53:54 +02:00
|
|
|
}
|
|
|
|
});
|
|
|
|
|
2012-10-09 02:27:14 +02:00
|
|
|
/**
|
|
|
|
* wp.media.view.Attachment.Library
|
|
|
|
*/
|
|
|
|
media.view.Attachment.Library = media.view.Attachment.extend({
|
|
|
|
className: 'attachment library'
|
|
|
|
});
|
|
|
|
|
2012-09-27 08:53:54 +02:00
|
|
|
/**
|
|
|
|
* wp.media.view.Attachment.Gallery
|
|
|
|
*/
|
|
|
|
media.view.Attachment.Gallery = media.view.Attachment.extend({
|
2012-09-27 09:45:26 +02:00
|
|
|
buttons: {
|
|
|
|
close: true
|
|
|
|
},
|
|
|
|
|
|
|
|
events: {
|
|
|
|
'click .close': 'toggleSelection'
|
|
|
|
}
|
2012-09-27 08:53:54 +02:00
|
|
|
});
|
|
|
|
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
/**
|
|
|
|
* wp.media.view.Workspace
|
|
|
|
*/
|
|
|
|
media.view.Workspace = Backbone.View.extend({
|
|
|
|
tagName: 'div',
|
|
|
|
className: 'media-workspace',
|
|
|
|
template: media.template('media-workspace'),
|
|
|
|
|
2012-10-03 06:21:50 +02:00
|
|
|
// The `options` to be passed to `Attachments` view.
|
|
|
|
attachmentsView: {},
|
2012-09-27 08:39:12 +02:00
|
|
|
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
events: {
|
|
|
|
'dragenter': 'maybeInitUploader',
|
|
|
|
'mouseenter': 'maybeInitUploader'
|
|
|
|
},
|
|
|
|
|
|
|
|
initialize: function() {
|
|
|
|
this.controller = this.options.controller;
|
|
|
|
|
|
|
|
_.defaults( this.options, {
|
2012-10-03 06:21:50 +02:00
|
|
|
selectOne: false,
|
|
|
|
uploader: {},
|
|
|
|
attachmentsView: {}
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
});
|
|
|
|
|
2012-09-06 09:46:15 +02:00
|
|
|
this.$content = $('<div class="existing-attachments" />');
|
|
|
|
|
2012-10-03 06:21:50 +02:00
|
|
|
// Generate the `options` passed to the `Attachments` view.
|
|
|
|
// Order of priority from lowest to highest: the provided defaults,
|
|
|
|
// the prototypal `attachmentsView` property, the `attachmentsView`
|
|
|
|
// option for the current instance, and then the `controller` and
|
|
|
|
// `collection` keys, to ensure they're correctly set.
|
|
|
|
this.attachmentsView = _.extend( {
|
|
|
|
directions: this.controller.get('multiple') ? l10n.selectMediaMultiple : l10n.selectMediaSingular
|
|
|
|
}, this.attachmentsView, this.options.attachmentsView, {
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
controller: this.controller,
|
2012-10-03 06:21:50 +02:00
|
|
|
collection: this.collection
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
});
|
|
|
|
|
2012-10-03 06:21:50 +02:00
|
|
|
// Initialize the `Attachments` view.
|
|
|
|
this.attachmentsView = new media.view.Attachments( this.attachmentsView );
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
this.$content.append( this.attachmentsView.$el );
|
|
|
|
|
|
|
|
// Track uploading attachments.
|
2012-09-11 18:55:58 +02:00
|
|
|
wp.Uploader.queue.on( 'add remove reset change:percent', this.renderUploadProgress, this );
|
2012-09-27 07:28:37 +02:00
|
|
|
wp.Uploader.queue.on( 'add', this.selectUpload, this );
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
},
|
|
|
|
|
|
|
|
render: function() {
|
2012-09-19 02:34:00 +02:00
|
|
|
this.$content.detach();
|
|
|
|
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
this.attachmentsView.render();
|
2012-09-11 18:55:58 +02:00
|
|
|
this.renderUploadProgress();
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
this.$el.html( this.template( this.options ) ).append( this.$content );
|
2012-09-11 18:55:58 +02:00
|
|
|
this.$bar = this.$('.upload-attachments .media-progress-bar div');
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
return this;
|
|
|
|
},
|
|
|
|
|
|
|
|
maybeInitUploader: function() {
|
|
|
|
var workspace = this;
|
|
|
|
|
|
|
|
// If the uploader already exists or the body isn't in the DOM, bail.
|
|
|
|
if ( this.uploader || ! this.$el.closest('body').length )
|
|
|
|
return;
|
|
|
|
|
|
|
|
this.uploader = new wp.Uploader( _.extend({
|
|
|
|
container: this.$el,
|
|
|
|
dropzone: this.$el,
|
2012-09-11 18:55:58 +02:00
|
|
|
browser: this.$('.upload-attachments a')
|
|
|
|
}, this.options.uploader ) );
|
|
|
|
},
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
|
2012-09-27 07:28:37 +02:00
|
|
|
selectUpload: function( attachment ) {
|
|
|
|
this.controller.selection.add( attachment );
|
|
|
|
},
|
|
|
|
|
2012-09-11 18:55:58 +02:00
|
|
|
renderUploadProgress: function() {
|
|
|
|
var queue = wp.Uploader.queue;
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
|
2012-09-11 18:55:58 +02:00
|
|
|
this.$el.toggleClass( 'uploading', !! queue.length );
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
|
2012-09-11 18:55:58 +02:00
|
|
|
if ( ! this.$bar || ! queue.length )
|
|
|
|
return;
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
|
2012-09-11 18:55:58 +02:00
|
|
|
this.$bar.width( ( queue.reduce( function( memo, attachment ) {
|
|
|
|
if ( attachment.get('uploading') )
|
|
|
|
return memo + ( attachment.get('percent') || 0 );
|
|
|
|
else
|
|
|
|
return memo + 100;
|
|
|
|
}, 0 ) / queue.length ) + '%' );
|
2012-09-19 02:34:00 +02:00
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
/**
|
|
|
|
* wp.media.view.Workspace.Library
|
|
|
|
*/
|
|
|
|
media.view.Workspace.Library = media.view.Workspace.extend({
|
2012-10-03 06:21:50 +02:00
|
|
|
|
2012-10-09 02:27:14 +02:00
|
|
|
attachmentsView: {
|
|
|
|
// The single `Attachment` view to be used in the `Attachments` view.
|
|
|
|
AttachmentView: media.view.Attachment.Library
|
|
|
|
},
|
|
|
|
|
2012-09-19 02:34:00 +02:00
|
|
|
initialize: function() {
|
|
|
|
media.view.Workspace.prototype.initialize.apply( this, arguments );
|
|
|
|
|
|
|
|
// If this supports multiple attachments, initialize the sample toolbar view.
|
|
|
|
if ( this.controller.get('multiple') )
|
|
|
|
this.initToolbarView();
|
2012-09-06 09:46:15 +02:00
|
|
|
},
|
|
|
|
|
|
|
|
// Initializes the toolbar view. Currently uses defaults set for
|
|
|
|
// inserting media into a post. This should be pulled out into the
|
|
|
|
// appropriate workflow when the time comes, but is currently here
|
|
|
|
// to test multiple selections.
|
|
|
|
initToolbarView: function() {
|
2012-09-19 02:34:00 +02:00
|
|
|
var controller = this.controller;
|
|
|
|
|
2012-09-06 09:46:15 +02:00
|
|
|
this.toolbarView = new media.view.Toolbar({
|
|
|
|
items: {
|
|
|
|
'selection-preview': new media.view.SelectionPreview({
|
|
|
|
controller: this.controller,
|
|
|
|
collection: this.controller.selection,
|
|
|
|
priority: -40
|
|
|
|
}),
|
2012-09-27 02:59:04 +02:00
|
|
|
|
2012-09-06 09:46:15 +02:00
|
|
|
'create-new-gallery': {
|
2012-09-27 03:11:04 +02:00
|
|
|
style: 'primary',
|
|
|
|
text: l10n.createNewGallery,
|
2012-09-27 02:59:04 +02:00
|
|
|
priority: 40,
|
2012-09-27 03:11:04 +02:00
|
|
|
|
|
|
|
click: function() {
|
2012-09-19 02:34:00 +02:00
|
|
|
controller.render('gallery');
|
|
|
|
}
|
2012-09-06 09:46:15 +02:00
|
|
|
},
|
2012-09-27 02:59:04 +02:00
|
|
|
|
|
|
|
'insert-into-post': {
|
2012-09-27 03:11:04 +02:00
|
|
|
text: l10n.insertIntoPost,
|
2012-09-27 06:09:43 +02:00
|
|
|
priority: 30,
|
Use the new media modal to insert galleries into TinyMCE and the text editor.
'''Galleries'''
* Gallery insertion from the new media modal (into TinyMCE, the text editor, etc).
* Gallery previews in TinyMCE now use the `wp.mce.views` API.
* Disables the TinyMCE `wpgallery` plugin.
* Gallery previews consist of the first image of the gallery and the appearance of a stack. This will later be fleshed out to include more images/functionality (including editing the gallery, gallery properties, and showing the number of images in the gallery).
* Multiple galleries can be added to a single post.
* The gallery MCE view provides a bridge between the `wp.shortcode` and `Attachments` representation of a gallery, which allows the existing collection to persist when a gallery is initially created (preventing a request to the server for the query).
'''Shortcodes'''
* Renames `wp.shortcode.Match` to `wp.shortcode` to better expose the shortcode constructor.
* The `wp.shortcode` constructor now accepts an object of options instead of a `wp.shortcode.regexp()` match.
* A `wp.shortcode` instance can be created from a `wp.shortcode.regexp()` match by calling `wp.shortcode.fromMatch( match )`.
* Adds `wp.shortcode.string()`, which takes a set of shortcode parameters and converts them into a string.* Renames `wp.shortcode.prototype.text()` to `wp.shortcode.prototype.string()`.
* Adds an additional capture group to `wp.shortcode.regexp()` that records whether or not the shortcode has a closing tag. This allows us to improve the accuracy of the syntax used when transforming a shortcode object back into a string.
'''Media Models'''
* Prevents media `Query` models from observing the central `Attachments.all` object when query args without corresponding filters are set (otherwise, queries quickly amass false positives).
* Adds `post__in`, `post__not_in`, and `post_parent` as acceptable JS attachment `Query` args.
* `Attachments.more()` always returns a `$.promise` object.
see #21390, #21809, #21812, #21815, #21817.
git-svn-id: http://core.svn.wordpress.org/trunk@22120 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-10-05 06:23:59 +02:00
|
|
|
click: _.bind( controller.update, controller, 'insert' )
|
2012-09-27 02:59:04 +02:00
|
|
|
},
|
|
|
|
|
2012-09-06 09:46:15 +02:00
|
|
|
'add-to-gallery': {
|
2012-09-27 03:11:04 +02:00
|
|
|
text: l10n.addToGallery,
|
2012-09-06 09:46:15 +02:00
|
|
|
priority: 20
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
this.controller.selection.on( 'add remove', function() {
|
2012-09-27 02:59:04 +02:00
|
|
|
var count = this.controller.selection.length,
|
|
|
|
showGallery;
|
|
|
|
|
|
|
|
this.$el.toggleClass( 'with-toolbar', !! count );
|
|
|
|
|
|
|
|
// Check if every attachment in the selection is an image.
|
|
|
|
showGallery = count > 1 && this.controller.selection.all( function( attachment ) {
|
|
|
|
return 'image' === attachment.get('type');
|
|
|
|
});
|
|
|
|
|
|
|
|
this.toolbarView.get('create-new-gallery').$el.toggle( showGallery );
|
|
|
|
insert = this.toolbarView.get('insert-into-post');
|
|
|
|
insert.model.set( 'style', showGallery ? '' : 'primary' );
|
2012-09-06 09:46:15 +02:00
|
|
|
}, this );
|
|
|
|
|
|
|
|
this.$content.append( this.toolbarView.$el );
|
2012-09-19 02:34:00 +02:00
|
|
|
}
|
|
|
|
});
|
|
|
|
|
2012-10-10 11:30:22 +02:00
|
|
|
media.view.Workspace.Library.Gallery = media.view.Workspace.Library.extend({
|
|
|
|
initToolbarView: function() {
|
|
|
|
var controller = this.controller,
|
|
|
|
editing = controller.get('editing'),
|
|
|
|
items = {
|
|
|
|
'selection-preview': new media.view.SelectionPreview({
|
|
|
|
controller: this.controller,
|
|
|
|
collection: this.controller.selection,
|
|
|
|
priority: -40,
|
|
|
|
clearable: false
|
|
|
|
}),
|
|
|
|
|
|
|
|
'continue-editing-gallery': {
|
|
|
|
style: 'primary',
|
|
|
|
text: l10n.continueEditingGallery,
|
|
|
|
priority: 40,
|
|
|
|
|
|
|
|
click: function() {
|
|
|
|
controller.render( 'gallery' );
|
|
|
|
}
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
this.toolbarView = new media.view.Toolbar({
|
|
|
|
items: items
|
|
|
|
});
|
|
|
|
|
|
|
|
this.$el.addClass('with-toolbar');
|
|
|
|
this.$content.append( this.toolbarView.$el );
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
2012-09-19 02:34:00 +02:00
|
|
|
/**
|
|
|
|
* wp.media.view.Workspace.Gallery
|
|
|
|
*/
|
|
|
|
media.view.Workspace.Gallery = media.view.Workspace.extend({
|
2012-10-03 06:21:50 +02:00
|
|
|
|
|
|
|
attachmentsView: {
|
|
|
|
// The single `Attachment` view to be used in the `Attachments` view.
|
|
|
|
AttachmentView: media.view.Attachment.Gallery,
|
|
|
|
sortable: true
|
|
|
|
},
|
2012-09-27 08:39:12 +02:00
|
|
|
|
2012-09-19 02:34:00 +02:00
|
|
|
initialize: function() {
|
|
|
|
media.view.Workspace.prototype.initialize.apply( this, arguments );
|
|
|
|
this.initToolbarView();
|
|
|
|
},
|
|
|
|
|
|
|
|
// Initializes the toolbar view. Currently uses defaults set for
|
|
|
|
// inserting media into a post. This should be pulled out into the
|
|
|
|
// appropriate workflow when the time comes, but is currently here
|
|
|
|
// to test multiple selections.
|
|
|
|
initToolbarView: function() {
|
2012-10-10 10:31:12 +02:00
|
|
|
var controller = this.controller,
|
|
|
|
editing = controller.get('editing'),
|
|
|
|
items = {
|
|
|
|
'update-gallery': {
|
2012-09-27 06:09:43 +02:00
|
|
|
style: 'primary',
|
2012-10-10 10:31:12 +02:00
|
|
|
text: editing ? l10n.updateGallery : l10n.insertGalleryIntoPost,
|
2012-09-19 02:34:00 +02:00
|
|
|
priority: 40,
|
Use the new media modal to insert galleries into TinyMCE and the text editor.
'''Galleries'''
* Gallery insertion from the new media modal (into TinyMCE, the text editor, etc).
* Gallery previews in TinyMCE now use the `wp.mce.views` API.
* Disables the TinyMCE `wpgallery` plugin.
* Gallery previews consist of the first image of the gallery and the appearance of a stack. This will later be fleshed out to include more images/functionality (including editing the gallery, gallery properties, and showing the number of images in the gallery).
* Multiple galleries can be added to a single post.
* The gallery MCE view provides a bridge between the `wp.shortcode` and `Attachments` representation of a gallery, which allows the existing collection to persist when a gallery is initially created (preventing a request to the server for the query).
'''Shortcodes'''
* Renames `wp.shortcode.Match` to `wp.shortcode` to better expose the shortcode constructor.
* The `wp.shortcode` constructor now accepts an object of options instead of a `wp.shortcode.regexp()` match.
* A `wp.shortcode` instance can be created from a `wp.shortcode.regexp()` match by calling `wp.shortcode.fromMatch( match )`.
* Adds `wp.shortcode.string()`, which takes a set of shortcode parameters and converts them into a string.* Renames `wp.shortcode.prototype.text()` to `wp.shortcode.prototype.string()`.
* Adds an additional capture group to `wp.shortcode.regexp()` that records whether or not the shortcode has a closing tag. This allows us to improve the accuracy of the syntax used when transforming a shortcode object back into a string.
'''Media Models'''
* Prevents media `Query` models from observing the central `Attachments.all` object when query args without corresponding filters are set (otherwise, queries quickly amass false positives).
* Adds `post__in`, `post__not_in`, and `post_parent` as acceptable JS attachment `Query` args.
* `Attachments.more()` always returns a `$.promise` object.
see #21390, #21809, #21812, #21815, #21817.
git-svn-id: http://core.svn.wordpress.org/trunk@22120 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-10-05 06:23:59 +02:00
|
|
|
click: _.bind( controller.update, controller, 'gallery' )
|
2012-09-19 02:34:00 +02:00
|
|
|
},
|
|
|
|
|
2012-10-10 11:30:22 +02:00
|
|
|
'return-to-library': {
|
|
|
|
text: editing ? l10n.addImagesFromLibrary : l10n.returnToLibrary,
|
|
|
|
priority: -40,
|
2012-10-10 10:31:12 +02:00
|
|
|
|
2012-10-10 11:30:22 +02:00
|
|
|
click: function() {
|
|
|
|
controller.render( editing ? 'gallery-library' : 'library' );
|
|
|
|
}
|
2012-10-10 10:31:12 +02:00
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
this.toolbarView = new media.view.Toolbar({
|
|
|
|
items: items
|
2012-09-19 02:34:00 +02:00
|
|
|
});
|
|
|
|
|
|
|
|
this.$el.addClass('with-toolbar');
|
|
|
|
this.$content.append( this.toolbarView.$el );
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
* wp.media.view.Attachments
|
|
|
|
*/
|
|
|
|
media.view.Attachments = Backbone.View.extend({
|
|
|
|
tagName: 'div',
|
|
|
|
className: 'attachments',
|
|
|
|
template: media.template('attachments'),
|
|
|
|
|
|
|
|
events: {
|
2012-10-11 01:32:48 +02:00
|
|
|
'keyup .search': 'search'
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
},
|
|
|
|
|
|
|
|
initialize: function() {
|
|
|
|
this.controller = this.options.controller;
|
|
|
|
|
|
|
|
_.defaults( this.options, {
|
|
|
|
refreshSensitivity: 200,
|
2012-09-27 08:39:12 +02:00
|
|
|
refreshThreshold: 3,
|
2012-10-03 06:21:50 +02:00
|
|
|
AttachmentView: media.view.Attachment,
|
|
|
|
sortable: false
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
});
|
|
|
|
|
|
|
|
_.each(['add','remove'], function( method ) {
|
|
|
|
this.collection.on( method, function( attachment, attachments, options ) {
|
|
|
|
this[ method ]( attachment, options.index );
|
|
|
|
}, this );
|
|
|
|
}, this );
|
|
|
|
|
|
|
|
this.collection.on( 'reset', this.refresh, this );
|
|
|
|
|
|
|
|
this.$list = $('<ul />');
|
|
|
|
this.list = this.$list[0];
|
|
|
|
|
|
|
|
this.scroll = _.chain( this.scroll ).bind( this ).throttle( this.options.refreshSensitivity ).value();
|
|
|
|
this.$list.on( 'scroll.attachments', this.scroll );
|
2012-10-03 06:21:50 +02:00
|
|
|
|
|
|
|
this.initSortable();
|
|
|
|
},
|
|
|
|
|
|
|
|
initSortable: function() {
|
|
|
|
var collection = this.collection,
|
|
|
|
from;
|
|
|
|
|
|
|
|
if ( ! this.options.sortable || ! $.fn.sortable )
|
|
|
|
return;
|
|
|
|
|
|
|
|
this.$list.sortable({
|
|
|
|
// If the `collection` has a `comparator`, disable sorting.
|
|
|
|
disabled: !! collection.comparator,
|
|
|
|
|
|
|
|
// Prevent attachments from being dragged outside the bounding
|
|
|
|
// box of the list.
|
|
|
|
containment: this.$list,
|
|
|
|
|
|
|
|
// Change the position of the attachment as soon as the
|
|
|
|
// mouse pointer overlaps a thumbnail.
|
|
|
|
tolerance: 'pointer',
|
|
|
|
|
|
|
|
// Record the initial `index` of the dragged model.
|
|
|
|
start: function( event, ui ) {
|
|
|
|
from = ui.item.index();
|
|
|
|
},
|
|
|
|
|
|
|
|
// Update the model's index in the collection.
|
|
|
|
// Do so silently, as the view is already accurate.
|
|
|
|
update: function( event, ui ) {
|
|
|
|
var model = collection.at( from );
|
|
|
|
|
|
|
|
collection.remove( model, {
|
|
|
|
silent: true
|
|
|
|
}).add( model, {
|
|
|
|
at: ui.item.index(),
|
|
|
|
silent: true
|
|
|
|
});
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
// If the `orderby` property is changed on the `collection`,
|
|
|
|
// check to see if we have a `comparator`. If so, disable sorting.
|
|
|
|
collection.props.on( 'change:orderby', function() {
|
|
|
|
this.$list.sortable( 'option', 'disabled', !! collection.comparator );
|
|
|
|
}, this );
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
},
|
|
|
|
|
|
|
|
render: function() {
|
2012-09-19 03:00:34 +02:00
|
|
|
// Detach the list from the DOM to prevent event removal.
|
|
|
|
this.$list.detach();
|
|
|
|
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
this.$el.html( this.template( this.options ) ).append( this.$list );
|
|
|
|
this.refresh();
|
|
|
|
return this;
|
|
|
|
},
|
|
|
|
|
|
|
|
refresh: function() {
|
|
|
|
// If there are no elements, load some.
|
|
|
|
if ( ! this.collection.length ) {
|
|
|
|
this.collection.more();
|
|
|
|
this.$list.empty();
|
|
|
|
return this;
|
|
|
|
}
|
|
|
|
|
|
|
|
// Otherwise, create all of the Attachment views, and replace
|
|
|
|
// the list in a single DOM operation.
|
|
|
|
this.$list.html( this.collection.map( function( attachment ) {
|
2012-09-27 08:39:12 +02:00
|
|
|
return new this.options.AttachmentView({
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
controller: this.controller,
|
|
|
|
model: attachment
|
|
|
|
}).render().$el;
|
|
|
|
}, this ) );
|
|
|
|
|
|
|
|
// Then, trigger the scroll event to check if we're within the
|
|
|
|
// threshold to query for additional attachments.
|
|
|
|
this.scroll();
|
|
|
|
return this;
|
|
|
|
},
|
|
|
|
|
|
|
|
add: function( attachment, index ) {
|
|
|
|
var view, children;
|
|
|
|
|
2012-09-27 08:53:54 +02:00
|
|
|
view = new this.options.AttachmentView({
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
controller: this.controller,
|
|
|
|
model: attachment
|
|
|
|
}).render();
|
|
|
|
|
|
|
|
children = this.$list.children();
|
|
|
|
|
|
|
|
if ( children.length > index )
|
|
|
|
children.eq( index ).before( view.$el );
|
|
|
|
else
|
|
|
|
this.$list.append( view.$el );
|
|
|
|
},
|
|
|
|
|
|
|
|
remove: function( attachment, index ) {
|
|
|
|
var children = this.$list.children();
|
|
|
|
if ( children.length )
|
|
|
|
children.eq( index ).detach();
|
|
|
|
},
|
|
|
|
|
|
|
|
scroll: function( event ) {
|
|
|
|
// @todo: is this still necessary?
|
|
|
|
if ( ! this.$list.is(':visible') )
|
|
|
|
return;
|
|
|
|
|
|
|
|
if ( this.list.scrollHeight < this.list.scrollTop + ( this.list.clientHeight * this.options.refreshThreshold ) ) {
|
|
|
|
this.collection.more();
|
|
|
|
}
|
|
|
|
},
|
|
|
|
|
|
|
|
search: function( event ) {
|
2012-09-18 23:42:29 +02:00
|
|
|
var props = this.collection.props;
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
|
|
|
|
if ( event.target.value )
|
2012-09-18 23:42:29 +02:00
|
|
|
props.set( 'search', event.target.value );
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
else
|
2012-09-18 23:42:29 +02:00
|
|
|
props.unset('search');
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
}
|
|
|
|
});
|
|
|
|
|
2012-09-06 09:46:15 +02:00
|
|
|
/**
|
|
|
|
* wp.media.view.SelectionPreview
|
|
|
|
*/
|
|
|
|
media.view.SelectionPreview = Backbone.View.extend({
|
|
|
|
tagName: 'div',
|
|
|
|
className: 'selection-preview',
|
|
|
|
template: media.template('media-selection-preview'),
|
|
|
|
|
|
|
|
events: {
|
|
|
|
'click .clear-selection': 'clear'
|
|
|
|
},
|
|
|
|
|
|
|
|
initialize: function() {
|
2012-10-10 11:30:22 +02:00
|
|
|
_.defaults( this.options, {
|
|
|
|
clearable: true
|
|
|
|
});
|
|
|
|
|
2012-09-06 09:46:15 +02:00
|
|
|
this.controller = this.options.controller;
|
|
|
|
this.collection.on( 'add change:url remove', this.render, this );
|
|
|
|
this.render();
|
|
|
|
},
|
|
|
|
|
|
|
|
render: function() {
|
2012-10-10 11:30:22 +02:00
|
|
|
var options = _.clone( this.options ),
|
2012-09-06 09:46:15 +02:00
|
|
|
first, sizes, amount;
|
|
|
|
|
|
|
|
// If nothing is selected, display nothing.
|
|
|
|
if ( ! this.collection.length ) {
|
|
|
|
this.$el.empty();
|
|
|
|
return this;
|
|
|
|
}
|
|
|
|
|
|
|
|
options.count = this.collection.length;
|
|
|
|
first = this.collection.first();
|
|
|
|
sizes = first.get('sizes');
|
2012-09-07 23:27:07 +02:00
|
|
|
|
|
|
|
if ( 'image' === first.get('type') )
|
|
|
|
options.thumbnail = ( sizes && sizes.thumbnail ) ? sizes.thumbnail.url : first.get('url');
|
|
|
|
else
|
|
|
|
options.thumbnail = first.get('icon');
|
2012-09-06 09:46:15 +02:00
|
|
|
|
|
|
|
this.$el.html( this.template( options ) );
|
|
|
|
return this;
|
|
|
|
},
|
|
|
|
|
|
|
|
clear: function( event ) {
|
|
|
|
event.preventDefault();
|
|
|
|
this.collection.clear();
|
|
|
|
}
|
|
|
|
});
|
Add new media workflow scripts, styles, and templates.
Please note that this commit does not integrate media into the existing UI. If you would like to see the new UI, navigate to the post editor and run the following in your browser's Javascript console:
new wp.media.controller.Workflow().render().modal.open();
The Javascript is broken up into two files, with the slugs media-models and media-views.
* media-models: The models are UI agnostic, and can be used independent of the views. If you'd like to create custom UIs, this is the script for you.
* media-views: This is the Media Experience. The views (and controllers) depend on the models (which are listed as a dependency and will automatically be included thanks to wp_enqueue_script). The views also require the media templates, media-view styles, and the plupload bridge settings. Perhaps we should create a function to include the whole shebang, but in the meantime...
To include media-views in the admin, run the following PHP in or after 'admin_enqueue_scripts':
wp_enqueue_script( 'media-views' );
wp_enqueue_style( 'media-views' );
wp_plupload_default_settings();
add_action( 'admin_footer', 'wp_print_media_templates' );
see #21390.
git-svn-id: http://core.svn.wordpress.org/trunk@21683 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2012-08-31 06:54:23 +02:00
|
|
|
}(jQuery));
|