WordPress.org

Make WordPress Core

Ticket #26631: 26631.15.patch

File 26631.15.patch, 13.6 KB (added by gcorne, 6 years ago)
  • src/wp-includes/js/media-views.js

    From 78bcbde5e31a313f5c90833a2a1f9c6a1959197e Mon Sep 17 00:00:00 2001
    From: Gregory Cornelius <gcorne@gmail.com>
    Date: Fri, 28 Feb 2014 21:19:10 -0600
    Subject: [PATCH 2/3] Refactor CollectionAdd and CollectionEdit
    MIME-Version: 1.0
    Content-Type: text/plain; charset=UTF-8
    Content-Transfer-Encoding: 8bit
    
    * Instead of generating new constructors use initialize method to set attributes based on the collectionType
    * Use reference to the SettingsView instead of grabbing it from the namespace. This better matches with existing AttachmentDisplay attribute
    * Switch from using ‘tag’ to ‘collectionType’ to better communicate what the purpose of the attribute is.
    ---
     src/wp-includes/js/media-views.js | 326 ++++++++++++++++++--------------------
     1 file changed, 153 insertions(+), 173 deletions(-)
    
    diff --git src/wp-includes/js/media-views.js src/wp-includes/js/media-views.js
    index 3ace225..d1fbc89 100644
     
    762762        /**
    763763         * wp.media.controller.CollectionEdit
    764764         *
    765          * @static
    766          * @param {string} prop The shortcode slug
    767          * @param {object} args
    768          * @returns {wp.media.controller.Library}
     765         * @constructor
     766         * @augments wp.media.controller.Library
     767         * @augments wp.media.controller.State
     768         * @augments Backbone.Model
    769769         */
    770         media.controller.CollectionEdit = function ( prop, args ) {
    771                 /**
    772                  * @constructor
    773                  * @augments wp.media.controller.Library
    774                  * @augments wp.media.controller.State
    775                  * @augments Backbone.Model
    776                  */
    777                 return media.controller.Library.extend({
    778                         defaults : _.defaults(args.defaults || {}, {
    779                                 id:         prop + '-edit',
    780                                 toolbar:    prop + '-edit',
    781                                 multiple:   false,
    782                                 describe:   true,
    783                                 edge:       199,
    784                                 editing:    false,
    785                                 sortable:   true,
    786                                 searchable: false,
    787                                 content:    'browse',
    788                                 priority:   60,
    789                                 dragInfo:   true,
    790 
    791                                 // Don't sync the selection, as the Edit {Collection} library
    792                                 // *is* the selection.
    793                                 syncSelection: false
    794                         }),
     770        media.controller.CollectionEdit = media.controller.Library.extend({
     771                defaults: {
     772                        multiple:     false,
     773                        describe:     true,
     774                        edge:         199,
     775                        editing:      false,
     776                        sortable:     true,
     777                        searchable:   false,
     778                        content:      'browse',
     779                        priority:     60,
     780                        dragInfo:     true,
     781                        SettingsView: false,
     782
     783                        // Don't sync the selection, as the Edit {Collection} library
     784                        // *is* the selection.
     785                        syncSelection: false
     786                },
    795787
    796                         initialize: function() {
    797                                 // If we haven't been provided a `library`, create a `Selection`.
    798                                 if ( ! this.get('library') ) {
    799                                         this.set( 'library', new media.model.Selection() );
    800                                 }
    801                                 // The single `Attachment` view to be used in the `Attachments` view.
    802                                 if ( ! this.get('AttachmentView') ) {
    803                                         this.set( 'AttachmentView', media.view.Attachment.EditLibrary );
    804                                 }
    805                                 media.controller.Library.prototype.initialize.apply( this, arguments );
    806                         },
     788                initialize: function() {
     789                        var collectionType = this.get('collectionType');
    807790
    808                         activate: function() {
    809                                 var library = this.get('library');
     791                        this.set( 'id', collectionType + '-edit' );
     792                        this.set( 'toolbar', collectionType + '-edit' );
    810793
    811                                 // Limit the library to images only.
    812                                 library.props.set( 'type', args.type );
     794                        // If we haven't been provided a `library`, create a `Selection`.
     795                        if ( ! this.get('library') ) {
     796                                this.set( 'library', new media.model.Selection() );
     797                        }
     798                        // The single `Attachment` view to be used in the `Attachments` view.
     799                        if ( ! this.get('AttachmentView') ) {
     800                                this.set( 'AttachmentView', media.view.Attachment.EditLibrary );
     801                        }
     802                        media.controller.Library.prototype.initialize.apply( this, arguments );
     803                },
    813804
    814                                 // Watch for uploaded attachments.
    815                                 this.get('library').observe( wp.Uploader.queue );
     805                activate: function() {
     806                        var library = this.get('library');
    816807
    817                                 this.frame.on( 'content:render:browse', this.settings, this );
     808                        // Limit the library to images only.
     809                        library.props.set( 'type', this.get( 'type' ) );
    818810
    819                                 media.controller.Library.prototype.activate.apply( this, arguments );
    820                         },
     811                        // Watch for uploaded attachments.
     812                        this.get('library').observe( wp.Uploader.queue );
    821813
    822                         deactivate: function() {
    823                                 // Stop watching for uploaded attachments.
    824                                 this.get('library').unobserve( wp.Uploader.queue );
     814                        this.frame.on( 'content:render:browse', this.renderSettings, this );
    825815
    826                                 this.frame.off( 'content:render:browse', this.settings, this );
     816                        media.controller.Library.prototype.activate.apply( this, arguments );
     817                },
    827818
    828                                 media.controller.Library.prototype.deactivate.apply( this, arguments );
    829                         },
     819                deactivate: function() {
     820                        // Stop watching for uploaded attachments.
     821                        this.get('library').unobserve( wp.Uploader.queue );
    830822
    831                         settings: function( browser ) {
    832                                 var library = this.get('library'), obj = {};
     823                        this.frame.off( 'content:render:browse', this.renderSettings, this );
    833824
    834                                 if ( ! library || ! browser ) {
    835                                         return;
    836                                 }
     825                        media.controller.Library.prototype.deactivate.apply( this, arguments );
     826                },
    837827
    838                                 library[ prop ] = library[ prop ] || new Backbone.Model();
     828                renderSettings: function( browser ) {
     829                        var library = this.get('library'),
     830                                collectionType = this.get('collectionType'),
     831                                dragInfoText = this.get('dragInfoText'),
     832                                SettingsView = this.get('SettingsView'),
     833                                obj = {};
    839834
    840                                 obj[ prop ] = new media.view.Settings[ args.settings ]({
    841                                         controller: this,
    842                                         model:      library[ prop ],
    843                                         priority:   40
    844                                 });
     835                        if ( ! library || ! browser ) {
     836                                return;
     837                        }
    845838
    846                                 browser.sidebar.set( obj );
     839                        library[ collectionType ] = library[ collectionType ] || new Backbone.Model();
    847840
    848                                 if ( args.dragInfoText ) {
    849                                         browser.toolbar.set( 'dragInfo', new media.View({
    850                                                 el: $( '<div class="instructions">' + args.dragInfoText + '</div>' )[0],
    851                                                 priority: -40
    852                                         }) );
    853                                 }
     841                        obj[ collectionType ] = new SettingsView({
     842                                controller: this,
     843                                model:      library[ collectionType ],
     844                                priority:   40
     845                        });
    854846
    855                                 browser.toolbar.set( 'reverse', {
    856                                         text:     l10n.reverseOrder,
    857                                         priority: 80,
     847                        browser.sidebar.set( obj );
    858848
    859                                         click: function() {
    860                                                 library.reset( library.toArray().reverse() );
    861                                         }
    862                                 });
     849                        if ( dragInfoText ) {
     850                                browser.toolbar.set( 'dragInfo', new media.View({
     851                                        el: $( '<div class="instructions">' + dragInfoText + '</div>' )[0],
     852                                        priority: -40
     853                                }) );
    863854                        }
    864                 });
    865         };
     855
     856                        browser.toolbar.set( 'reverse', {
     857                                text:     l10n.reverseOrder,
     858                                priority: 80,
     859
     860                                click: function() {
     861                                        library.reset( library.toArray().reverse() );
     862                                }
     863                        });
     864                }
     865        });
    866866
    867867        /**
    868868         * wp.media.controller.CollectionAdd
     
    872872         * @augments wp.media.controller.State
    873873         * @augments Backbone.Model
    874874         */
    875         media.controller.CollectionAdd = function (attributes) {
    876                 var ExtendedLibrary, extended = _.extend( attributes, {
    877                         defaults: _.defaults( {
    878                                 id: attributes.tag + '-library',
    879                                 title: attributes.title,
    880                                 menu: attributes.tag,
    881                                 toolbar: attributes.tag + '-add',
    882                                 filterable: 'uploaded',
    883                                 multiple:   'add',
    884                                 priority:   100,
    885                                 syncSelection: false
    886                         }, media.controller.Library.prototype.defaults ),
    887 
    888                         initialize: function() {
    889                                 // If we haven't been provided a `library`, create a `Selection`.
    890                                 if ( ! this.get('library') ) {
    891                                         this.set( 'library', media.query({ type: this.type }) );
    892                                 }
    893                                 media.controller.Library.prototype.initialize.apply( this, arguments );
    894                         },
     875        media.controller.CollectionAdd = media.controller.Library.extend({
     876                defaults: _.defaults( {
     877                        filterable:    'uploaded',
     878                        multiple:      'add',
     879                        priority:      100,
     880                        syncSelection: false
     881                }, media.controller.Library.prototype.defaults ),
    895882
    896                         activate: function() {
    897                                 var library = this.get('library'),
    898                                         edit    = this.frame.state( this.tag + '-edit' ).get('library');
     883                initialize: function() {
     884                        var collectionType = this.get('collectionType');
    899885
    900                                 if ( this.editLibrary && this.editLibrary !== edit ) {
    901                                         library.unobserve( this.editLibrary );
    902                                 }
     886                        this.set( 'id', collectionType + '-library' );
     887                        this.set( 'toolbar', collectionType + '-add' );
     888                        this.set( 'menu', collectionType );
    903889
    904                                 // Accepts attachments that exist in the original library and
    905                                 // that do not exist in gallery's library.
    906                                 library.validator = function( attachment ) {
    907                                         return !! this.mirroring.get( attachment.cid ) && ! edit.get( attachment.cid ) && media.model.Selection.prototype.validator.apply( this, arguments );
    908                                 };
     890                        // If we haven't been provided a `library`, create a `Selection`.
     891                        if ( ! this.get('library') ) {
     892                                this.set( 'library', media.query({ type: this.get('type') }) );
     893                        }
     894                        media.controller.Library.prototype.initialize.apply( this, arguments );
     895                },
    909896
    910                                 // Reset the library to ensure that all attachments are re-added
    911                                 // to the collection. Do so silently, as calling `observe` will
    912                                 // trigger the `reset` event.
    913                                 library.reset( library.mirroring.models, { silent: true });
    914                                 library.observe( edit );
    915                                 this.editLibrary = edit;
     897                activate: function() {
     898                        var library = this.get('library'),
     899                                editLibrary = this.get('editLibrary'),
     900                                edit = this.frame.state( this.get('collectionType') + '-edit' ).get('library');
    916901
    917                                 media.controller.Library.prototype.activate.apply( this, arguments );
     902                        if ( editLibrary && editLibrary !== edit ) {
     903                                library.unobserve( editLibrary );
    918904                        }
    919                 } );
    920                 ExtendedLibrary = media.controller.Library.extend( extended );
    921 
    922                 return new ExtendedLibrary();
    923         };
    924905
    925         // wp.media.controller.GalleryEdit
    926         // -------------------------------
    927         media.controller.GalleryEdit = media.controller.CollectionEdit( 'gallery', {
    928                 type: 'image',
    929                 settings: 'Gallery',
    930                 defaults: {
    931                         title: l10n.editGalleryTitle
    932                 }
    933         });
     906                        // Accepts attachments that exist in the original library and
     907                        // that do not exist in gallery's library.
     908                        library.validator = function( attachment ) {
     909                                return !! this.mirroring.get( attachment.cid ) && ! edit.get( attachment.cid ) && media.model.Selection.prototype.validator.apply( this, arguments );
     910                        };
    934911
    935         // wp.media.controller.PlaylistEdit
    936         // -------------------------------
    937         media.controller.PlaylistEdit = media.controller.CollectionEdit( 'playlist', {
    938                 type: 'audio',
    939                 settings: 'Playlist',
    940                 dragInfoText: l10n.playlistDragInfo,
    941                 defaults: {
    942                         title: l10n.editPlaylistTitle,
    943                         dragInfo : false
    944                 }
    945         });
     912                        // Reset the library to ensure that all attachments are re-added
     913                        // to the collection. Do so silently, as calling `observe` will
     914                        // trigger the `reset` event.
     915                        library.reset( library.mirroring.models, { silent: true });
     916                        library.observe( edit );
     917                        this.set('editLibrary', edit);
    946918
    947         // wp.media.controller.VideoPlaylistEdit
    948         // -------------------------------
    949         media.controller.VideoPlaylistEdit = media.controller.CollectionEdit( 'video-playlist', {
    950                 type: 'video',
    951                 settings: 'Playlist',
    952                 dragInfoText: l10n.videoPlaylistDragInfo,
    953                 defaults: {
    954                         title: l10n.editVideoPlaylistTitle,
    955                         dragInfo : false
     919                        media.controller.Library.prototype.activate.apply( this, arguments );
    956920                }
    957921        });
    958922
     
    17761740                                new media.controller.Embed(),
    17771741
    17781742                                // Gallery states.
    1779                                 new media.controller.GalleryEdit({
    1780                                         library: options.selection,
    1781                                         editing: options.editing,
    1782                                         menu:    'gallery'
     1743                                new media.controller.CollectionEdit({
     1744                                        type:           'image',
     1745                                        collectionType: 'gallery',
     1746                                        title:           l10n.editGalleryTitle,
     1747                                        SettingsView:    media.view.Settings.Gallery,
     1748                                        library:         options.selection,
     1749                                        editing:         options.editing,
     1750                                        menu:           'gallery'
    17831751                                }),
    17841752
    17851753                                new media.controller.CollectionAdd({
    1786                                         tag: 'gallery',
    1787                                         type: 'image',
    1788                                         title: l10n.addToGalleryTitle
     1754                                        type:           'image',
     1755                                        collectionType: 'gallery',
     1756                                        title:          l10n.addToGalleryTitle
    17891757                                }),
    17901758
    17911759                                new media.controller.Library({
     
    18031771                                }),
    18041772
    18051773                                // Playlist states.
    1806                                 new media.controller.PlaylistEdit({
    1807                                         library: options.selection,
    1808                                         editing: options.editing,
    1809                                         menu:    'playlist'
     1774                                new media.controller.CollectionEdit({
     1775                                        type:           'audio',
     1776                                        collectionType: 'playlist',
     1777                                        title:          l10n.editPlaylistTitle,
     1778                                        SettingsView:   media.view.Settings.Playlist,
     1779                                        library:        options.selection,
     1780                                        editing:        options.editing,
     1781                                        menu:           'playlist',
     1782                                        dragInfoText:   l10n.playlistDragInfo,
     1783                                        dragInfo:       false
    18101784                                }),
    18111785
    18121786                                new media.controller.CollectionAdd({
    1813                                         tag: 'playlist',
    18141787                                        type: 'audio',
     1788                                        collectionType: 'playlist',
    18151789                                        title: l10n.addToPlaylistTitle
    18161790                                }),
    18171791
     
    18301804                                }),
    18311805
    18321806                                // Video Playlist states.
    1833                                 new media.controller.VideoPlaylistEdit({
    1834                                         library: options.selection,
    1835                                         editing: options.editing,
    1836                                         menu:    'video-playlist'
     1807                                new media.controller.CollectionEdit({
     1808                                        type:           'video',
     1809                                        collectionType: 'video-playlist',
     1810                                        title:          l10n.editVideoPlaylistTitle,
     1811                                        SettingsView:   media.view.Settings.Playlist,
     1812                                        library:        options.selection,
     1813                                        editing:        options.editing,
     1814                                        menu:           'video-playlist',
     1815                                        dragInfoText:   l10n.videoPlaylistDragInfo,
     1816                                        dragInfo:       false
    18371817                                }),
    18381818
    18391819                                new media.controller.CollectionAdd({
    1840                                         tag: 'video-playlist',
    1841                                         type: 'video',
    1842                                         title: l10n.addToVideoPlaylistTitle
     1820                                        type:           'video',
     1821                                        collectionType: 'video-playlist',
     1822                                        title:          l10n.addToVideoPlaylistTitle
    18431823                                })
    18441824                        ]);
    18451825