Changeset 22335

Timestamp:

10/30/2012 11:15:16 PM (12 years ago)

Author:

koopersmith

Message:

Media JS: Improve handling of single attachments in selections.

• Adds wp.media.model.Selection.single() to specify a single item used in a multi-item selection.
• Fixes a bug where the details class would not be removed when "Clear Selection" was clicked.

see #21390.

Location:

trunk/wp-includes

Files:

• css/media-views.css (modified) (1 diff)
• js/media-models.js (modified) (4 diffs)
• js/media-views.js (modified) (5 diffs)

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

@@ -245 +245 @@
     background: #777;
     border: 1px solid #fff;
-    /*border-width: 0 1px 1px 0;*/
     border-width: 0 0 1px 1px;
     box-shadow: -1px 1px 0 rgba( 0, 0, 0, 0.1 );

trunk/wp-includes/js/media-models.js

@@ -623 +623 @@
             Attachments.prototype.initialize.apply( this, arguments );
             this.multiple = options && options.multiple;
+
+            // Refresh the `single` model whenever the selection changes.
+            // Binds `single` instead of using the context argument to ensure
+            // it receives no parameters.
+            this.on( 'add remove reset', _.bind( this.single, this ) );
         },
 
@@ -639 +644 @@
         // Removes all models from the selection.
         clear: function( options ) {
-            return this.remove( this.models, options );
+            this.remove( this.models, options ).single();
+            return this;
         },
 
@@ -646 +652 @@
         // as we need them to fire.
         reset: function( models, options ) {
-            return this.clear( options ).add( models, options );
+            this.clear( options ).add( models, options ).single();
+            return this;
         },
 
@@ -654 +661 @@
         has: function( attachment ) {
             return !! ( this.getByCid( attachment.cid ) || this.get( attachment.id ) );
+        },
+
+        single: function( model ) {
+            var previous = this._single;
+
+            // If a `model` is provided, use it as the single model.
+            if ( model )
+                this._single = model;
+
+            // If the single model isn't in the selection, remove it.
+            if ( this._single && ! this.has( this._single ) )
+                delete this._single;
+
+            this._single = this._single || this.last();
+
+            // If single has changed, fire an event.
+            if ( this._single !== previous ) {
+                if ( this._single )
+                    this._single.trigger( 'selection:single', this._single, this );
+                if ( previous )
+                    previous.trigger( 'selection:unsingle', previous, this );
+            }
+
+            // Return the single model, or the last model as a fallback.
+            return this._single;
         }
     });

trunk/wp-includes/js/media-views.js

@@ -213 +213 @@
 
         details: function( options ) {
-            var model = this.get('details'),
+            var model = this.get('selection').single(),
                 view;
 
@@ -233 +233 @@
 
         toggleSelection: function( model ) {
-            var details = this.get('details'),
-                selection = this.get('selection'),
-                selected = selection.has( model );
-
-            if ( ! selection )
-                return;
-
-            if ( ! selected )
-                selection.add( model );
-
-            // If the model is not the same as the details model,
-            // it now becomes the details model. If the model is
-            // in the selection, it is not removed.
-            if ( details !== model ) {
-                this.set( 'details', model );
-                return;
-            }
-
-            // The model is the details model.
-            // Removed it from the selection.
-            selection.remove( model );
-
-            // Show the last selected item, or clear the details view.
-            if ( selection.length )
-                this.set( 'details', selection.last() );
-            else
-                this.unset('details');
-
+            var selection = this.get('selection');
+
+            if ( selection.has( model ) ) {
+                // If the model is the single model, remove it.
+                // If it is not the same as the single model,
+                // it now becomes the single model.
+                selection[ selection.single() === model ? 'remove' : 'single' ]( model );
+            } else {
+                selection.add( model ).single();
+            }
+
+            return this;
         }
     });
@@ -1088 +1072 @@
 
             // Update the model's details view.
-            this.controller.state().on( 'change:details', this.details, this );
+            this.model.on( 'selection:single selection:unsingle', this.details, this );
             this.details();
 
@@ -1095 +1079 @@
 
         destroy: function() {
-            this.controller.state().off( 'change:details', this.details, this );
+            this.model.off( 'single', this.details, this );
         },
 
@@ -1137 +1121 @@
         },
 
-        details: function() {
-            var details = this.controller.state().get('details');
+        details: function( model, collection ) {
+            var selection = this.controller.state().get('selection'),
+                details;
+
+            if ( selection !== collection )
+                return;
+
+            details = selection.single();
             this.$el.toggleClass( 'details', details === this.model );
         },