Could anyone help me make a new field type for NHP Theme Options Framework based on "upload" type so that it would use the new "Media Manager" that Wordpress uses since 3.5 instead of Media Uploader. This would be very useful for use with sliders.
Maybe this post would be helpful.
you're in luck i needed this same functionality. I managed to do it by looking at the code and applying the same override techniques as the the old media manager.
In fact i've written a tutorial about it here.
Here's the javascript code:
(function($){
var doc = {
ready: function(){
// initialize only if our button is in the page
if($('#btn_browse_files').length > 0){
slider.init();
}
}
},
slider = {
// the following 2 objects would be our backup containers
// as we will be replacing the default media handlers
media_send_attachment: null,
media_close_window: null,
init: function(){
// bind the button's click the browse_clicked handler
$('#btn_browse_files').click(slider.browse_clicked);
},
browse_clicked: function(event){
// cancel the event so we won't be navigated to href="#"
event.preventDefault();
// backup editor objects first
slider.media_send_attachment = wp.media.editor.send.attachment;
slider.media_close_window = wp.media.editor.remove;
// override the objects with our own
wp.media.editor.send.attachment = slider.media_accept;
wp.media.editor.remove = slider.media_close;
// open up the media manager window
wp.media.editor.open();
},
media_accept: function(props, attachment){
// this function is called when the media manager sends in media info
// when the user clicks the "Insert into Post" button
// this may be called multiple times (one for each selected file)
// you might be interested in the following:
// alert(attachment.id); // this stands for the id of the media attachment passed
// alert(attachment.url); // this is the url of the media attachment passed
// for now let's log it the console
// not you can do anything Javascript-ly possible here
console.log(props);
console.log(attachment);
},
media_close: function(id){
// this function is called when the media manager wants to close
// (either close button or after sending the selected items)
// restore editor objects from backup
wp.media.editor.send.attachment = slider.media_send_attachment;
wp.media.editor.remove = slider.media_close_window;
// nullify the backup objects to free up some memory
slider.media_send_attachment= null;
slider.media_close_window= null;
// trigger the actual remove
wp.media.editor.remove(id);
}
};
$(document).ready(doc.ready);
})(jQuery);
See the usage in our vafpress theme framework github code snippet:
media manager with WP < 3.5 fallback
in the code, there is also this variable (vp_wp.use_new_media_upload), that you will need to 'expose' into your JS code via wp_localize_script, that variable needed to state whether the Wordpress you're running is under 3.5 or not, if it's under 3.5 then it's should not use the new media manager, and use the old method using thickbox media-upload.php iframe.
NHP has just merged with Redux Framework and Redux 3.0 has been released. It can be run as a Wordpress Plugin or Embedded within a theme. You should really give the new version a try.
http://wordpress.org/plugins/redux-framework/
It has full Wordpress media 3.5 support, and then some. It not only stores the media URL, but also the ID and full-dimension size.
Seriously, check it out.
