samedi 27 décembre 2014

How to open media browser from tinyMCE window?


I'm trying to create a shortcode to embed audio files, with custom data as copyright owners and year, etc. It's a basic tinyMCE window with textboxes to insert the information, and the URL of audio files uploaded to the media library.


What I need is a way to create a button on this window; when clicked (onclick), open the media library, so I can find audio files and when insert it, populate the textbox "audio_url".


My code by now (not working properly, see below):



{ // this is only one option from a lisbox where my other shortcodes are...
text: 'Audio Shortcode',
onclick: function() {
var win = editor.windowManager.open( {
title: 'Insert Audio',
body: [
{type: 'textbox',
name: 'audio_url',
id: 'audio-url',
label: 'File...',
value: '',
},
{type: 'button',
name: 'find',
text: 'Find...',
onclick: function() {
var audiofield = win.find('#audio-url');
var myurl = tb_show("Audio search", "media-upload.php?type=audio&height=700&width=600&TB_iframe=true");
editor.windowManager.open({
url: myurl,
width: 700,
height: 600,
resizable: 'yes',
close_previous: 'no',
oninsert: function ( url ) {
audiofield.value = url;
}
}
)},
},
],
onsubmit: function( e ) {
editor.insertContent( '[audiomb src="' + e.data.audio_url + '"]');
}
});
} },


So it will show a textbox where the file URL must be, and a button to open the media library, where I can find a file and insert it - what will populate the field.


It's not working because the tb_show iframe loads behind the tinymce window, and an empty window in front. How can I make it appear on top (focus), them browse the media gallery to get the file URL? Do tinymce has a better way to work on it (instead of tb_show)? Thank you all.





Aucun commentaire:

Enregistrer un commentaire