Media Grid: make the edit attachment icon clickable.

Props ericlewis.
See #24716.

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


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

wp-includes/css/media-views-rtl.css

@@ -2643,6 +2643,9 @@ video#inline-media-node {
 	font-weight: 300;
 }
 
+.media-frame.mode-bulk-edit .attachment:hover .inline-toolbar {
+	display: none;
+}
 
 .edit-attachment-frame .edit-media-header .left:before {
 	content: '\f340';

wp-includes/css/media-views.css

@@ -2643,6 +2643,9 @@ video#inline-media-node {
 	font-weight: 300;
 }
 
+.media-frame.mode-bulk-edit .attachment:hover .inline-toolbar {
+	display: none;
+}
 
 .edit-attachment-frame .edit-media-header .left:before {
 	content: '\f340';

wp-includes/js/media-views.js

@@ -1812,7 +1812,7 @@
 			this.activeModes.on( 'add remove reset', _.bind( this.triggerModeEvents, this ) );
 
 			_.each( this.options.mode, function( mode ) {
-				this.activeModes.add( new Backbone.Model( { id: mode } ) );
+				this.activateMode( mode );
 			}, this );
 
 			// Force the uploader off if the upload limit has been exceeded or
@@ -2005,7 +2005,11 @@
 			this.trigger( eventToTrigger );
 		},
 		activateMode: function( mode ) {
+			if ( this.activeModes.where( { id: mode } ).length ) {
+				return;
+			}
 			this.activeModes.add( [ { id: mode } ] );
+			this.$el.addClass( 'mode-' + mode );
 			this.trigger( mode + ':activate' );
 		},
 		deactivateMode: function( mode ) {
@@ -2014,6 +2018,7 @@
 				return;
 			}
 			this.activeModes.remove( this.activeModes.where( { id: mode } ) );
+			this.$el.removeClass( 'mode-' + mode );
 			this.trigger( mode + ':deactivate' );
 		}
 	});
@@ -4590,7 +4595,7 @@
 		},
 
 		events: {
-			'click .attachment-preview':      'toggleSelectionHandler',
+			'click .js--select-attachment':   'toggleSelectionHandler',
 			'change [data-setting]':          'updateSetting',
 			'change [data-setting] input':    'updateSetting',
 			'change [data-setting] select':   'updateSetting',

wp-includes/media-template.php

@@ -386,11 +386,11 @@ function wp_print_media_templates() {
 
 	<script type="text/html" id="tmpl-attachment">
 		<# if ( _.contains( data.controller.options.mode, 'grid' ) ) { #>
-		<div class="inline-toolbar">
+		<div class="inline-toolbar js--select-attachment">
 			<div class="dashicons dashicons-edit edit edit-media"></div>
 		</div>
 		<# } #>
-		<div class="attachment-preview type-{{ data.type }} subtype-{{ data.subtype }} {{ data.orientation }}">
+		<div class="attachment-preview js--select-attachment type-{{ data.type }} subtype-{{ data.subtype }} {{ data.orientation }}">
 			<# if ( data.uploading ) { #>
 				<div class="media-progress-bar"><div></div></div>
 			<# } else if ( 'image' === data.type ) { #>