मीडिया मोडल बॉक्स में फ़िल्टर फंक्शन जोड़ें


12

मैं मीडिया मोडल को बढ़ाने की कोशिश कर रहा हूं, लेकिन मैं इसके बारे में कोई प्रलेखन / ट्यूटोरियल नहीं ढूंढ सकता। मैं रीढ़ की हड्डी का स्वामी भी नहीं हूं ;-)

मैं प्रत्येक टैक्सोनॉमी के लिए एक चयन बॉक्स जोड़ना चाहता हूं जो अटैचमेंट पोस्ट प्रकार से जुड़ा हुआ है। फिलहाल केवल एक चुनिंदा बॉक्स दिखाया गया है।

तो यही वह है मुझे जो मिला है। यह महान काम करता है सिवाय इसके कि यह डिफ़ॉल्ट टूलबार को बदल देता है।


कोड

/**
 * 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() );
        }
    });

});

मूल

यहाँ छवि विवरण दर्ज करें


मेरा परिणाम है

यहाँ छवि विवरण दर्ज करें


मैं क्या चाहता हूँ

यहाँ छवि विवरण दर्ज करें


पूर्ण कोड

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

जवाबों:


8

Backbone.js और WP की अद्भुत दुनिया (जिनमें से मैं मुश्किल से कुछ भी जानता हूं)।

मुझे लगता है कि समस्या यह है कि आप केवल उसी डिफ़ॉल्ट को कॉल कर रहे हैं media.view, इसके बजाय मुझे विश्वास है कि आपको एक नया आरंभ करने की आवश्यकता है।

उदाहरण के लिए:

/**
 * 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() );
    }
});

आपको नीचे कुछ देना होगा (मैंने पूरी तरह से त्रुटि जाँच नहीं की थी लेकिन यह काम करता है)।


यहाँ छवि विवरण दर्ज करें


आप के साथ ऐसा करने media.view.AttachmentFiltersऔर संबंध के साथ कुछ भी रिवाज पर विचार करना चाहिए window.wp.media;


बहुत बढ़िया धन्यवाद! मुझे जल्द ही backbone.js के बारे में पढ़ना चाहिए, क्योंकि ऐसा लगता है कि यह हर नए WP संस्करण में अधिक एकीकृत है।
हॉर्टकोर

1
यह एक प्लगइन बनाने के लिए धन्यवाद, इसलिए इसका उत्तर देना आसान था :) वास्तव में आपने मुझे WPSE प्रश्नों के लिए जीथब प्लगइन बनाने के लिए प्रेरित किया है।
व्येक
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.