When editing a gallery, images can now be added from the media library.

Enables the "Add images from media library" button when editing. The UX has room for improvement, but it's a start.

see #21390, #21809.


git-svn-id: http://core.svn.wordpress.org/trunk@22157 1a063a9b-81f0-0310-95a4-ce76da25c4cd

wp-includes/js/media-views.js

@@ -42,11 +42,16 @@
 			// then unset the property.
 			this.add( 'library', media.view.Workspace.Library, {
 				collection: media.query( this.get('library') )
-			} );
+			});
 			this.unset('library');
 
 			// Add the gallery view.
-			this.add( 'gallery', media.view.Workspace.Gallery, { collection: this.selection } );
+			this.add( 'gallery', media.view.Workspace.Gallery, {
+				collection: this.selection
+			});
+			this.add( 'gallery-library', media.view.Workspace.Library.Gallery, {
+				collection: media.query({ type: 'image' })
+			});
 		},
 
 
@@ -719,6 +724,38 @@
 		}
 	});
 
+	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 );
+		}
+	});
+
 	/**
 	 * wp.media.view.Workspace.Gallery
 	 */
@@ -750,22 +787,15 @@
 						click:    _.bind( controller.update, controller, 'gallery' )
 					},
 
-					'add-images-from-library': {
+					'return-to-library': {
-						text:     l10n.addImagesFromLibrary,
+						text:     editing ? l10n.addImagesFromLibrary : l10n.returnToLibrary,
-						priority: 30
-					}
-				};
-
-			if ( ! editing ) {
-				items['return-to-library'] = {
-					text:     l10n.returnToLibrary,
 						priority: -40,
 
 						click: function() {
-						controller.render('library');
+							controller.render( editing ? 'gallery-library' : 'library' );
+						}
 					}
 				};
-			}
 
 			this.toolbarView = new media.view.Toolbar({
 				items: items
@@ -948,13 +978,17 @@
 		},
 
 		initialize: function() {
+			_.defaults( this.options, {
+				clearable: true
+			});
+
 			this.controller = this.options.controller;
 			this.collection.on( 'add change:url remove', this.render, this );
 			this.render();
 		},
 
 		render: function() {
-			var options = {},
+			var options = _.clone( this.options ),
 				first, sizes, amount;
 
 			// If nothing is selected, display nothing.

wp-includes/media.php

@@ -1358,7 +1358,9 @@ function wp_print_media_templates( $attachment ) {
 
 			<span class="count"><%- count %></span>
 		</div>
+		<% if ( clearable ) { %>
 			<a class="clear-selection" href="#"><?php _e('Clear selection'); ?></a>
+		<% } %>
 	</script>
 
 	<script type="text/html" id="tmpl-editor-attachment">

wp-includes/script-loader.php

@@ -329,6 +329,7 @@ function wp_default_scripts( &$scripts ) {
 
 		// Gallery
 		'returnToLibrary'        => __( 'Return to media library' ),
+		'continueEditingGallery' => __( 'Continue editing gallery' ),
 		'insertGalleryIntoPost'  => __( 'Insert gallery into post' ),
 		'updateGallery'          => __( 'Update gallery' ),
 		'addImagesFromLibrary'   => __( 'Add images from media library' ),