WordPress.org

Make WordPress Core

Ticket #24716: 24716.36.diff

File 24716.36.diff, 6.3 KB (added by ericlewis, 4 years ago)
  • src/wp-includes/css/media-views.css

    diff --git a/src/wp-includes/css/media-views.css b/src/wp-includes/css/media-views.css
    index ad5a7be..2a9914f 100644
    a b  
    228228.media-toolbar-secondary > .media-button,
    229229.media-toolbar-secondary > .media-button-group {
    230230        margin-right: 10px;
    231         float: left;
    232231        margin-top: 15px;
    233232}
    234233
  • src/wp-includes/js/media-grid.js

    diff --git a/src/wp-includes/js/media-grid.js b/src/wp-includes/js/media-grid.js
    index 0ebbc67..73a6dfd 100644
    a b  
    125125                                modal:     false,
    126126                                selection: [],
    127127                                library:   {},
    128                                 multiple:  false,
     128                                multiple:  'add',
    129129                                state:     'library',
    130130                                uploader:  true,
    131131                                mode:      [ 'grid', 'edit' ]
     
    514514                }
    515515        });
    516516
     517        media.view.BulkSelectionToggleButton = media.view.Button.extend({
     518                initialize: function() {
     519                        media.view.Button.prototype.initialize.apply( this, arguments );
     520                        this.listenTo( this.controller, 'bulk-edit:activate bulk-edit:deactivate', _.bind( this.toggleBulkEditHandler, this ) );
     521                },
     522
     523                click: function() {
     524                        var bulkEditActive = this.controller.activeModes.where( { id: 'bulk-edit' } ).length;
     525                        media.view.Button.prototype.click.apply( this, arguments );
     526
     527                        if ( bulkEditActive ) {
     528                                this.controller.deactivateMode( 'bulk-edit' );
     529                                this.controller.activateMode( 'edit' );
     530                        } else {
     531                                this.controller.deactivateMode( 'edit' );
     532                                this.controller.activateMode( 'bulk-edit' );
     533                        }
     534                },
     535
     536                toggleBulkEditHandler: function() {
     537                        var bulkEditActive = this.controller.activeModes.where( { id: 'bulk-edit' } ).length;
     538                        if ( bulkEditActive ) {
     539                                this.$el.addClass( 'button-primary' );
     540                        } else {
     541                                this.$el.removeClass( 'button-primary' );
     542                                this.controller.state().get('selection').reset();
     543                        }
     544                }
     545        });
     546
     547        media.view.BulkDeleteButton = media.view.Button.extend({
     548                initialize: function() {
     549                        media.view.Button.prototype.initialize.apply( this, arguments );
     550                        this.$el.hide();
     551                        this.listenTo( this.controller, 'bulk-edit:activate bulk-edit:deactivate', _.bind( this.visibility, this ) );
     552                },
     553
     554                click: function() {
     555                        media.view.Button.prototype.click.apply( this, arguments );
     556                        while (this.controller.state().get('selection').length > 0) {
     557                                this.controller.state().get('selection').at(0).destroy();
     558                        }
     559                },
     560
     561                visibility: function() {
     562                        var bulkEditActive = this.controller.activeModes.where( { id: 'bulk-edit' } ).length;
     563                        if ( bulkEditActive ) {
     564                                this.$el.show();
     565                        } else {
     566                                this.$el.hide();
     567                        }
     568                }
     569        });
     570
    517571}(jQuery, _, Backbone, wp));
     572 No newline at end of file
  • src/wp-includes/js/media-views.js

    diff --git a/src/wp-includes/js/media-views.js b/src/wp-includes/js/media-views.js
    index 6bf147c..bc618ab 100644
    a b  
    17851785                 * @global wp.Uploader
    17861786                 */
    17871787                initialize: function() {
    1788 
    17891788                        media.view.Frame.prototype.initialize.apply( this, arguments );
    17901789
    17911790                        _.defaults( this.options, {
    17921791                                title:    '',
    17931792                                modal:    true,
    17941793                                uploader: true,
    1795                                 mode:     ['select']
     1794                                mode:     [ 'select' ]
    17961795                        });
    17971796
    17981797                        // Ensure core UI is enabled.
     
    18081807                                this.modal.content( this );
    18091808                        }
    18101809
     1810                        // Store active "modes" that the frame is in. Unrelated to region modes.
     1811                        this.activeModes = new Backbone.Collection();
     1812                        this.activeModes.on( 'add remove reset', _.bind( this.triggerModeEvents, this ) );
     1813
     1814                        _.each( this.options.mode, function( mode ) {
     1815                                this.activeModes.add( new Backbone.Model( { id: mode } ) );
     1816                        }, this );
     1817
    18111818                        // Force the uploader off if the upload limit has been exceeded or
    18121819                        // if the browser isn't supported.
    18131820                        if ( wp.Uploader.limitExceeded || ! wp.Uploader.browser.supported ) {
     
    19721979
    19731980                        window.tb_remove = this._tb_remove;
    19741981                        delete this._tb_remove;
     1982                },
     1983
     1984                /**
     1985                 * Map activeMode collection events to the frame.
     1986                 */
     1987                triggerModeEvents: function( model, collection, options ) {
     1988                        var collectionEvent,
     1989                                modeEventMap = {
     1990                                        add: 'activate',
     1991                                        remove: 'deactivate'
     1992                                },
     1993                                eventToTrigger;
     1994                        // Probably a better way to do this.
     1995                        _.each( options, function( value, key ) {
     1996                                if ( value ) {
     1997                                        collectionEvent = key;
     1998                                }
     1999                        } );
     2000
     2001                        if ( ! _.has( modeEventMap, collectionEvent ) )
     2002                                return;
     2003
     2004                        eventToTrigger = model.get('id') + ':' + modeEventMap[collectionEvent];
     2005                        this.trigger( eventToTrigger );
     2006                },
     2007                activateMode: function( mode ) {
     2008                        this.activeModes.add( [ { id: mode } ] );
     2009                        this.trigger( mode + ':activate' );
     2010                },
     2011                deactivateMode: function( mode ) {
     2012                        // Bail if the mode isn't active.
     2013                        if ( ! this.activeModes.where( { id: mode } ).length ) {
     2014                                return;
     2015                        }
     2016                        this.activeModes.remove( this.activeModes.where( { id: mode } ) );
     2017                        this.trigger( mode + ':deactivate' );
    19752018                }
    19762019        });
    19772020
     
    46734716                        }
    46744717
    46754718                        // In the grid view, bubble up an edit:attachment event to the controller.
    4676                         if ( _.contains( this.controller.options.mode, 'grid' ) ) {
     4719                        if ( this.controller.activeModes.where( { id: 'edit' } ).length ) {
    46774720                                this.controller.trigger( 'edit:attachment', this.model );
    46784721                                return;
    46794722                        }
     
    55685611                        // Feels odd to bring the global media library switcher into the Attachment
    55695612                        // browser view. Is this a use case for doAction( 'add:toolbar-items:attachments-browser', this.toolbar );
    55705613                        // which the controller can tap into and add this view?
    5571                         if ( _.contains( this.controller.options.mode, 'grid' ) ) {
     5614                        if ( this.controller.activeModes.where( { id: 'grid' } ).length ) {
    55725615                                LibraryViewSwitcher = media.View.extend({
    55735616                                        className: 'view-switch media-grid-view-switch',
    55745617                                        template: media.template( 'media-library-view-switcher')
     
    55785621                                        priority: -90
    55795622                                }).render() );
    55805623
     5624                                this.toolbar.set( 'bulkSelectionToggleButton', new media.view.BulkSelectionToggleButton({
     5625                                        text: 'Bulk Edit',
     5626                                        controller: this.controller,
     5627                                        priority: -70
     5628                                }).render() );
     5629
     5630                                this.toolbar.set( 'BulkDeleteButton', new media.view.BulkDeleteButton({
     5631                                        text: 'Bulk Delete',
     5632                                        controller: this.controller,
     5633                                        priority: -69
     5634                                }).render() );
     5635
    55815636                                this.toolbar.set( 'gridFieldOptions', new media.view.GridFieldOptions({
    55825637                                        controller: this.controller,
    55835638                                        priority: -50