Gallery editing in the media modal.
The edit button on gallery MCE views will open a new instance of the media modal. Images can be removed, uploaded, and reordered. However, the "Add images from media library" button is not yet functional. see #21390, #21809, #21815. git-svn-id: http://core.svn.wordpress.org/trunk@22155 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Daryl Koopersmith
parent
24d9eefa46
commit
70bd368ad8
|
|
@ -90,7 +90,7 @@ var tb_position;
|
|||
// WordPress, TinyMCE, and Media
|
||||
// -----------------------------
|
||||
(function($){
|
||||
// Stores the editors' `wp.media.controller.Workflow` instaces.
|
||||
// Stores the editors' `wp.media.controller.Workflow` instances.
|
||||
var workflows = {};
|
||||
|
||||
wp.mce.media = {
|
||||
|
|
|
|||
|
|
@ -546,7 +546,8 @@ window.wp = window.wp || {};
|
|||
},
|
||||
|
||||
shortcode: function( attachments ) {
|
||||
var attrs = _.pick( attachments.props.toJSON(), 'include', 'exclude', 'orderby', 'order' ),
|
||||
var props = attachments.props.toJSON(),
|
||||
attrs = _.pick( props, 'include', 'exclude', 'orderby', 'order' ),
|
||||
shortcode;
|
||||
|
||||
attrs.ids = attachments.pluck('id');
|
||||
|
|
@ -557,7 +558,11 @@ window.wp = window.wp || {};
|
|||
type: 'single'
|
||||
});
|
||||
|
||||
galleries[ shortcode.string() ] = attachments;
|
||||
// Use a cloned version of the gallery.
|
||||
galleries[ shortcode.string() ] = new wp.media.model.Attachments( attachments.models, {
|
||||
props: props
|
||||
});
|
||||
|
||||
return shortcode;
|
||||
}
|
||||
};
|
||||
|
|
@ -574,14 +579,18 @@ window.wp = window.wp || {};
|
|||
parent: $('#post_ID').val(),
|
||||
|
||||
events: {
|
||||
'click .close': 'remove'
|
||||
'click .close': 'remove',
|
||||
'click .edit': 'edit'
|
||||
},
|
||||
|
||||
initialize: function() {
|
||||
var view = mceview.get('gallery'),
|
||||
shortcode = this.options.shortcode;
|
||||
this.update();
|
||||
},
|
||||
|
||||
this.attachments = view.gallery.attachments( shortcode, this.parent );
|
||||
update: function() {
|
||||
var view = mceview.get('gallery');
|
||||
|
||||
this.attachments = view.gallery.attachments( this.options.shortcode, this.parent );
|
||||
this.attachments.more().done( _.bind( this.render, this ) );
|
||||
},
|
||||
|
||||
|
|
@ -601,6 +610,34 @@ window.wp = window.wp || {};
|
|||
};
|
||||
|
||||
this.$el.html( this.template( options ) );
|
||||
},
|
||||
|
||||
edit: function() {
|
||||
if ( ! wp.media.view || this.workflow )
|
||||
return;
|
||||
|
||||
this.workflow = wp.media({
|
||||
view: 'gallery',
|
||||
selection: this.attachments.models,
|
||||
title: mceview.l10n.editGallery,
|
||||
editing: true,
|
||||
multiple: true
|
||||
});
|
||||
|
||||
// Create a single-use workflow. If the workflow is closed,
|
||||
// then detach it from the DOM and remove the reference.
|
||||
this.workflow.on( 'close', function() {
|
||||
this.workflow.detach();
|
||||
delete this.workflow;
|
||||
}, this );
|
||||
|
||||
// Update the `shortcode` and `attachments`.
|
||||
this.workflow.on( 'update:gallery', function( selection ) {
|
||||
var view = mceview.get('gallery');
|
||||
|
||||
this.options.shortcode = view.gallery.shortcode( selection );
|
||||
this.update();
|
||||
}, this );
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -119,8 +119,8 @@
|
|||
|
||||
update: function( event ) {
|
||||
this.close();
|
||||
this.trigger( 'update', this.selection );
|
||||
this.trigger( 'update:' + event, this.selection );
|
||||
this.trigger( 'update', this.selection, this );
|
||||
this.trigger( 'update:' + event, this.selection, this );
|
||||
this.selection.clear();
|
||||
},
|
||||
|
||||
|
|
@ -217,18 +217,22 @@
|
|||
|
||||
attach: function() {
|
||||
this.$el.appendTo( this.options.container );
|
||||
this.controller.trigger( 'attach', this.controller );
|
||||
},
|
||||
|
||||
detach: function() {
|
||||
this.$el.detach();
|
||||
this.controller.trigger( 'detach', this.controller );
|
||||
},
|
||||
|
||||
open: function() {
|
||||
this.$el.show();
|
||||
this.controller.trigger( 'open', this.controller );
|
||||
},
|
||||
|
||||
close: function() {
|
||||
this.$el.hide();
|
||||
this.controller.trigger( 'close', this.controller );
|
||||
},
|
||||
|
||||
closeHandler: function( event ) {
|
||||
|
|
@ -277,8 +281,8 @@
|
|||
// Make sure to detach the elements we want to reuse.
|
||||
// Otherwise, `jQuery.html()` will unbind their events.
|
||||
$( _.pluck( this._views, 'el' ) ).detach();
|
||||
this.$primary.html( _.pluck( views.primary, 'el' ) );
|
||||
this.$secondary.html( _.pluck( views.secondary, 'el' ) );
|
||||
this.$primary.html( _.pluck( views.primary || [], 'el' ) );
|
||||
this.$secondary.html( _.pluck( views.secondary || [], 'el' ) );
|
||||
|
||||
return this;
|
||||
},
|
||||
|
|
@ -736,22 +740,12 @@
|
|||
// appropriate workflow when the time comes, but is currently here
|
||||
// to test multiple selections.
|
||||
initToolbarView: function() {
|
||||
var controller = this.controller;
|
||||
|
||||
this.toolbarView = new media.view.Toolbar({
|
||||
items: {
|
||||
'return-to-library': {
|
||||
text: l10n.returnToLibrary,
|
||||
priority: -40,
|
||||
|
||||
click: function() {
|
||||
controller.render('library');
|
||||
}
|
||||
},
|
||||
|
||||
'insert-gallery-into-post': {
|
||||
var controller = this.controller,
|
||||
editing = controller.get('editing'),
|
||||
items = {
|
||||
'update-gallery': {
|
||||
style: 'primary',
|
||||
text: l10n.insertGalleryIntoPost,
|
||||
text: editing ? l10n.updateGallery : l10n.insertGalleryIntoPost,
|
||||
priority: 40,
|
||||
click: _.bind( controller.update, controller, 'gallery' )
|
||||
},
|
||||
|
|
@ -760,7 +754,21 @@
|
|||
text: l10n.addImagesFromLibrary,
|
||||
priority: 30
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
if ( ! editing ) {
|
||||
items['return-to-library'] = {
|
||||
text: l10n.returnToLibrary,
|
||||
priority: -40,
|
||||
|
||||
click: function() {
|
||||
controller.render('library');
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
this.toolbarView = new media.view.Toolbar({
|
||||
items: items
|
||||
});
|
||||
|
||||
this.$el.addClass('with-toolbar');
|
||||
|
|
|
|||
|
|
@ -330,6 +330,7 @@ function wp_default_scripts( &$scripts ) {
|
|||
// Gallery
|
||||
'returnToLibrary' => __( 'Return to media library' ),
|
||||
'insertGalleryIntoPost' => __( 'Insert gallery into post' ),
|
||||
'updateGallery' => __( 'Update gallery' ),
|
||||
'addImagesFromLibrary' => __( 'Add images from media library' ),
|
||||
) );
|
||||
|
||||
|
|
@ -337,6 +338,7 @@ function wp_default_scripts( &$scripts ) {
|
|||
$scripts->add( 'mce-view', "/wp-includes/js/mce-view$suffix.js", array( 'shortcode', 'media-models' ), false, 1 );
|
||||
did_action( 'init' ) && $scripts->localize( 'mce-view', '_wpMceViewL10n', array(
|
||||
'contentWidth' => isset( $GLOBALS['content_width'] ) ? $GLOBALS['content_width'] : 800,
|
||||
'editGallery' => __( 'Edit Gallery' ),
|
||||
) );
|
||||
|
||||
if ( is_admin() ) {
|
||||
|
|
|
|||
Loading…
Reference in New Issue