I have a small issue creating a small plugin. I am trying to achieve a gallery meta box using Media Upload 3.5.
At this point I am able to upload images, but when trying to update the image. I wont get the same Post->ID as the Attachments (I strongly believe this is where the issue is at.) Perhaps I am doing something wrong with the shortcode api snippet or the way I'm passing my data.
Above is the code for the js and some functions. If it helps I used "shibashake" Wordpress Media Manager as a Starting Point.
function media_view_settings( $settings, $post ) {
$shortcode = '[gallery ';
$ids = get_post_meta( $post->ID, 'gallery_ids', TRUE );
$ids = array(0);
if ( is_array( $ids ) ) {
$shortcode .= 'ids="' . implode( ',', $ids ) . '"]';
} else {
$shortcode .= 'id="' . $post->ID . '"]';
}
$settings['Gallery'] = array('shortcode' => $shortcode);
return $settings;
}
function metabox( $post ) {
global $post;
wp_nonce_field( 'gallery', 'gallery_nonce');
$gallery = get_post_meta( $post->ID);
echo '<div id="gallery-container">';
echo '<p>' . do_shortcode( '[gallery ids="' . $gallery[ 'gallery_ids' ][0] . '" link="none"]' ) . '</p>';
echo '<p><a href="#" id="open-media" class="button button-primary" title="' . esc_attr__( 'Add Media', 'gallery-meta-box' ) . '">' . __( 'Add Media', 'gallery-meta-box' ) . '</a></p>';
echo '<p><input type="hidden" id="gallery_ids" value="' . $gallery[ 'gallery_ids' ]. '" /></p>';
echo '</div>';
}
public function save_content( $post_id ) {
// Checks save status
$is_autosave = wp_is_post_autosave( $post_id );
$is_revision = wp_is_post_revision( $post_id );
$is_valid_nonce = ( isset( $_POST[ 'gallery_nonce' ] ) && wp_verify_nonce( $_POST[ 'gallery_nonce' ], 'gallery' ) ) ? 'true' : 'false';
// Exits script depending on save status
if ( $is_autosave || $is_revision || !$is_valid_nonce ) {
return;
}
// Checks for input and sanitizes/saves if needed
if( isset( $_POST[ 'gallery_ids' ] ) ) {
update_post_meta( $post_id, 'gallery_ids', sanitize_text_field( $_POST[ 'gallery_ids' ] ) );
}
}
JS
jQuery(document).ready(function(){ wp.media.GalleryMetabox = {
frame: function() {
if ( this._frame )
return this._frame;
var selection = this.select();
this._frame = wp.media({
id: 'my-frame',
frame: 'post',
state: 'gallery-edit',
title: wp.media.view.l10n.editGalleryTitle,
editing: true,
multiple: true,
selection: selection,
});
this._frame.on( 'update', function() {
var controller = wp.media.GalleryMetabox._frame.states.get('gallery-edit');
var library = controller.get('library');
// Need to get all the attachment ids for gallery
var ids = library.pluck('id');
// AJAX send (isn't currently working)
wp.media.post( 'GalleryMetabox-update', {
nonce: wp.media.view.settings.post.nonce,
html: wp.media.GalleryMetabox.link,
post_id: wp.media.view.settings.post.id,
ids: ids
}).done( function() {
window.location = wp.media.GalleryMetabox.link;
});
/*
// Turn off refreshContent callback so we do not throw a null error
controller.off('reset');
*/
// Send the attachment URL to our custom input field via jQuery.
jQuery('#gallery_ids').val( ids );
});
return this._frame;
},
// Gets initial gallery-edit images. Function modified from wp.media.gallery.edit:513
// in wp-includes/js/media-editor.js.source.html
select: function() {
var shortcode = wp.shortcode.next( 'gallery', wp.media.view.settings.Gallery.shortcode ),
defaultPostId = wp.media.gallery.defaults.id,
attachments, selection, state;
// Bail if we didn't match the shortcode.
if ( ! shortcode )
return;
// Ignore the rest of the match object.
shortcode = shortcode.shortcode;
if ( _.isUndefined( shortcode.get('id') ) && ! _.isUndefined( defaultPostId ) ) {
shortcode.set( 'id', defaultPostId );
}
attachments = wp.media.gallery.attachments( shortcode );
//console.log(attachments.models);
selection = new wp.media.model.Selection( attachments.models, {
props: attachments.props.toJSON(),
multiple: true
});
selection.gallery = attachments.gallery;
// Fetch the query's attachments, and then break ties from the
// query to allow for sorting.
selection.more().done( function() {
// Break ties with the query.
selection.props.set({ query: false });
selection.unmirror();
selection.props.unset('orderby');
});
return selection;
},
init: function() {
jQuery('#open-media').click( function( event ) {
event.preventDefault();
wp.media.GalleryMetabox.frame().open([0]);
});
}
};
jQuery(document).ready(function(){
jQuery( wp.media.GalleryMetabox.init );
});
Thanks
