Ajouter une fonction de filtre dans la boîte modale multimédia

J'essaie d'étendre le modal média, mais je ne trouve pas de documentation / tutoriels à ce sujet. Je ne suis pas non plus un maître de l'épine dorsale ;-)

Je souhaite ajouter une case de sélection pour chaque taxonomie attachée au type de publication de pièce jointe. Pour le moment, une seule case de sélection est affichée.

Voilà donc ce que j'ai trouvé. Cela fonctionne très bien, sauf qu'il remplace la barre d'outils par défaut.

Code

/**
 * Extended Filters dropdown with taxonomy term selection values
 */
jQuery.each(mediaTaxonomies,function(key,label){

    media.view.AttachmentFilters[key] = media.view.AttachmentFilters.extend({
        className: key,

        createFilters: function() {
            var filters = {};

            _.each( mediaTerms[key] || {}, function( term ) {

                var query = {};

                query[key] = {
                    taxonomy: key,
                    term_id: parseInt( term.id, 10 ),
                    term_slug: term.slug
                };

                filters[ term.slug ] = {
                    text: term.label,
                    props: query
                };
            });

            this.filters = filters;
        }

    });

    /**
     * Replace the media-toolbar with our own
     */
    media.view.AttachmentsBrowser = media.view.AttachmentsBrowser.extend({
        createToolbar: function() {

            media.model.Query.defaultArgs.filterSource = 'filter-media-taxonomies';

            this.toolbar = new media.view.Toolbar({
                controller: this.controller
            });

            this.views.add( this.toolbar );

            this.toolbar.set( 'terms', new media.view.AttachmentFilters[key]({
                controller: this.controller,
                model:      this.collection.props,
                priority:   -80
            }).render() );
        }
    });

});

Original

Mon résultat

Ce que je veux

Code complet

https://github.com/Horttcore/Media-Taxonomies

Le monde merveilleux de Backbone.js et WP (dont je ne connais presque rien).

Je pense que le problème est que vous appelez simplement la même valeur par défaut media.view, mais je pense que vous devez en initialiser une nouvelle.

Par exemple:

/**
 * Replace the media-toolbar with our own
 */
    var myDrop = media.view.AttachmentsBrowser;

    media.view.AttachmentsBrowser = media.view.AttachmentsBrowser.extend({
    createToolbar: function() {

        media.model.Query.defaultArgs.filterSource = 'filter-media-taxonomies';

        myDrop.prototype.createToolbar.apply(this,arguments);

        this.toolbar.set( key, new media.view.AttachmentFilters[key]({
            controller: this.controller,
            model:      this.collection.props,
            priority:   -80
        }).render() );
    }
});

Vous donnerait quelque chose comme ci-dessous (je n'ai pas fait de vérification d'erreur approfondie mais cela fonctionne).

Vous devriez également envisager de le faire avec media.view.AttachmentFilterset tout ce qui est personnalisé en ce qui concerne window.wp.media;.