Zeigen Sie ausgewählte Bilder oben im Media Manager an

Ich habe zahlreiche Fragen zu StackOverflow und WordPress Awnsers durchsucht, aber ich konnte keine Lösung finden, die meiner Situation entspricht oder mir sogar aus der Ferne in die richtige Richtung weist.

Ich habe einen benutzerdefinierten Medienrahmen in meinem Plugin, wo ich bestimmte Bilder aus einer Medienbibliothek von ungefähr 3000 Bildern vorausgewählt habe. Diese vorausgewählten Bilder werden jedoch standardmäßig nicht über der Liste sortiert. Dies führt dazu, dass Sie die Liste stundenlang durchsuchen, um die ausgewählten Bilder zu finden. Kurz gesagt, ich möchte, dass diese ganz oben auf der Liste stehen. Ich habe ihre IDs.

Ich habe festgestellt, dass in media-models.js der Code lautet:

Query = media.model.Query = Attachments.extend({ ... 

Es behandelt die Abfrage / Sortierung der Anhänge, die im Medienmanager angezeigt werden.

Ich habe versucht, es so in meiner Hauptplugin-Javascript-Datei zu erweitern

 wp.media.model.Query = wp.media.model.Attachments.extend({ ... 

was mir kein ergebnis und zahlreiche andere anregungen in frage stellte, die meiner situation ähnlich sahen. Jetzt bin ich an dem Punkt, an dem ich nicht weiß, wie ich das angehen soll. Könnte mir jemand in die richtige Richtung zeigen?


EDIT: Nun, ich konnte die Anfragen meines Medienrahmens beeinflussen.

In meinem main.js in meinem Plugin mache ich das jetzt:

 file_frame = wp.media.frames.file_frame = wp.media({ id: 'multi_image', title: 'Select images', button: { text: 'Use selected images' }, library: { type: 'image', post__in:[3322,3323,3324,3325,3326,3327,3328] }, multiple: true, }); 

Auf diese Weise kann ich dem Medienrahmen zeigen, dass nur die Bildanhänge mit bestimmten IDs angezeigt werden. Allerdings möchte ich auch den Rest der Anhänge anzeigen, nur mit meinen ausgewählten Bildern an der Spitze. Also müsste ich entweder die Ergebnisse dieser Abfrage kombinieren, indem ich eine neue Abfrage mit post__not_in statt post__in anlege, oder indem ich die Attachments, die den Anhängen die Priorität dieser ID geben, individuell anordne. Ich weiß nicht, wie ich das machen soll. Die Argumente, die ich an die Bibliothek weitergeben kann, scheinen mir begrenzt zu sein.

Solutions Collecting From Web of "Zeigen Sie ausgewählte Bilder oben im Media Manager an"

Nach dem Lesen der Backbone.js-Dokumentation habe ich herausgefunden, dass es recht einfach ist, Anlagen per ID manuell zur Bibliothek des Medienrahmens hinzuzufügen.

Sie können der Bibliothek nur einen Verweis auf das offene Ereignis zuweisen. Erstellen Sie dann eine Instanz von wp.media.attachment. Hole es. Und dann rufen Sie die function add in Ihrem Bibliotheksverweis auf und übergeben Sie den Anhang damit. Ich hatte meine Anhangs-ID in einem Array und durchschlug sie wie folgt:

 file_frame.on('open',function(){ var lib = file_frame.state().get('library'); for (var i=0;i 

EDIT: Zusätzlich stieß ich auf ein Problem, bei dem die Sortierung manchmal durcheinander gebracht wurde und einige meiner Anhänge nicht auf der Liste standen. Um sicherzustellen, dass sie dies taten, habe ich die Komparatorfunktion der Bibliothek so übersteuert, um einen Vergleich der ID zu erzwingen. Es wurde get (key), aber ich verwandelte es in get ('id'):

 lib.comparator = function ( a, b, options ) { var key = this.props.get('orderby'), order = this.props.get('order') || 'DESC', ac = a.cid, bc = b.cid; a = a.get( 'id' ); b = b.get( 'id' ); if ( 'date' === key || 'modified' === key ) { a = a || new Date(); b = b || new Date(); } // If `options.ties` is set, don't enforce the `cid` tiebreaker. if ( options && options.ties ) ac = bc = null; return ( 'DESC' === order ) ? compare( a, b, ac, bc ) : compare( b, a, bc, ac ); } 

Es wird jedoch darüber jammern, dass die Vergleichsfunktion nicht definiert ist. Also habe ich es einfach so erklärt wie in wp.media:

 compare = function( a, b, ac, bc ) { if ( _.isEqual( a, b ) ) return ac === bc ? 0 : (ac > bc ? -1 : 1); else return a > b ? -1 : 1; }; 

Dieser Komparator muss festgelegt werden, bevor neue Anhänge zur Bibliothek hinzugefügt werden. Weil sonst das Problem bestehen bleibt.

Ich musste genau das für ein Plugin tun, an dem ich arbeite, und eine etwas andere Lösung gefunden haben, basierend auf dem, was Ogier getan hat (was mich in die richtige Richtung wies, danke!)

Mit dem von Ogier gelieferten Code habe ich festgestellt, dass die ausgewählten Bilder selbst mit dem zusätzlichen Comparator-Code nicht oben auftauchten. Nachdem ich ein wenig im core und speziell dem Code für die Featurebilder gegraben hatte, fand ich den Komparator, den sie dafür verwenden es scheint gut zu funktionieren.

Sie finden den FeaturedImage-Controller in wp-includes / js / media-views.js. Ich habe den Vergleichscode von dort genommen und bin mit (Code-Schnipsel) fertig:

 $('.quote-items').on('click', '.quote-edit-image', function (e) { e.preventDefault(); var id = $(this).attr('id'); var index = $(this).attr('data-index'); var images = quote.get_product_gallery(index); file_frame = wp.media.frames.file_frame = wp.media({ title: 'Title', button: { text: 'Select', }, multiple: false, // Set to true to allow multiple files to be selected }); file_frame.on('open', function () { var lib = file_frame.state().get('library'); lib.comparator = function( a, b ) { var aInQuery = !! this.mirroring.get( a.cid ), bInQuery = !! this.mirroring.get( b.cid ); if ( ! aInQuery && bInQuery ) { return -1; } else if ( aInQuery && ! bInQuery ) { return 1; } else { return 0; } }; images.forEach(function(id){ attachment = wp.media.attachment(id); attachment.fetch(); lib.add( attachment ? [ attachment ] : [] ); }); }); file_frame.on( 'select', function() { // We set multiple to false so only get one image from the uploader attachment = file_frame.state().get('selection').first().toJSON(); $('#' + id +' img').attr('src', attachment.sizes.thumbnail.url); }); file_frame.open(); }); 

Beachten Sie, dass ich den Komparator leicht bearbeitet habe, um keine Vergleichsfunktion zu verwenden, die nicht definiert ist. Sie können dies jederzeit definieren.