Changeset 27841

Timestamp:

03/29/2014 08:01:13 AM (11 years ago)

Author:

nacin

Message:

Media Manager: Hide 'Create Playlist' menu items until the user has uploaded audio or video.

props gcorne.
fixes #27554.

File:

• trunk/src/wp-includes/js/media-views.js (modified) (7 diffs)

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

@@ -1886 +1886 @@
     media.view.MediaFrame.Post = media.view.MediaFrame.Select.extend({
         initialize: function() {
+            this.counts = {
+                audio: {
+                    count: media.view.settings.attachmentCounts.audio,
+                    state: 'playlist'
+                },
+                video: {
+                    count: media.view.settings.attachmentCounts.video,
+                    state: 'video-playlist'
+                }
+            };
+
             _.defaults( this.options, {
                 multiple:  true,
@@ -1896 +1907 @@
             media.view.MediaFrame.Select.prototype.initialize.apply( this, arguments );
             this.createIframeStates();
+
         },
 
@@ -2033 +2045 @@
 
         bindHandlers: function() {
-            /**
-             * call 'bindHandlers' directly on the parent class
-             */
+            var handlers, checkCounts;
+
             media.view.MediaFrame.Select.prototype.bindHandlers.apply( this, arguments );
+
+            this.on( 'activate', this.activate, this );
+
+            // Only bother checking media type counts if one of the counts is zero
+            checkCounts = _.find( this.counts, function( type ) {
+                return type.count === 0;
+            } );
+
+            if ( typeof checkCounts !== 'undefined' ) {
+                this.listenTo( media.model.Attachments.all, 'change:type', this.mediaTypeCounts );
+            }
+
             this.on( 'menu:create:gallery', this.createMenu, this );
             this.on( 'menu:create:playlist', this.createMenu, this );
@@ -2047 +2070 @@
             this.on( 'toolbar:create:main-embed', this.mainEmbedToolbar, this );
 
-            var handlers = {
+            handlers = {
                 menu: {
                     'default': 'mainMenu',
@@ -2082 +2105 @@
         },
 
+        activate: function() {
+            // Hide menu items for states tied to particular media types if there are no items
+            _.each( this.counts, function( type ) {
+                if ( type.count < 1 ) {
+                    this.menuItemVisibility( type.state, 'hide' );
+                }
+            }, this );
+        },
+
+        mediaTypeCounts: function( model, attr ) {
+            if ( typeof this.counts[ attr ] !== 'undefined' && this.counts[ attr ].count < 1 ) {
+                this.counts[ attr ].count++;
+                this.menuItemVisibility( this.counts[ attr ].state, 'show' );
+            }
+        },
+
         // Menus
         /**
@@ -2093 +2132 @@
                 })
             });
+        },
+
+        menuItemVisibility: function( state, visibility ) {
+            var menu = this.menu.get();
+            if ( visibility === 'hide' ) {
+                menu.hide( state );
+            } else if ( visibility === 'show' ) {
+                menu.show( state );
+            }
         },
         /**
@@ -4067 +4115 @@
         deselect: function() {
             this.$el.children().removeClass('active');
+        },
+
+        hide: function( id ) {
+            var view = this.get( id );
+
+            if ( ! view ) {
+                return;
+            }
+
+            view.$el.addClass('hidden');
+        },
+
+        show: function( id ) {
+            var view = this.get( id );
+
+            if ( ! view ) {
+                return;
+            }
+
+            view.$el.removeClass('hidden');
         }
     });