In one of my projects I integrated CKEditor with a very simple jQuery (www.jquery.com) AJAX Upload script (based on jQuery: http://valums.com/ajax-upload/ ) and nyroModal for the loading-box (definately not necessary to use such a complex script for that, but I use it for other parts so it was the easiest way for me, you can find it on: http://nyromodal.nyrodev.com/ ) and made a simple function for quickly uploading and inserting images to the site. In my opinion, the whole broswer step is unnecessary to most users, so why bother?
How it works: I unhide the browse-button that's hidden as standard and located to the right of the url-input box. I then add the AJAXUpload-functionality, which makes the button clickable. When the button is clicked, a window opens with the users disk, so that he can locate the image he wants. Then, the AJAXUpload-script automatically makes an AJAX-request to upload the file (and you'll have to make that part yourself but you can find a very easy example on the AJAX Upload scripts homepage), which saves the file on the server and returns the address in the input-field.
If someone has the time to enhance the script to not use the jQuery for locating the input-box and instead using the proper CKEditor-function that would be great.
Anyway, I hope this can help some ppl on making this awesome editor making it a little bit more awesome for them and easy to use Enjoy!
CKEDITOR.on( 'dialogDefinition', function( ev ) { // Take the dialog name and its definition from the event // data. var dialogName = ev.data.name; var dialogDefinition = ev.data.definition; // Check if the definition is from the dialog we're // interested on (the "Link" dialog). if ( dialogName == 'image' ) { // Get a reference to the "Link Info" tab and the "Browse" button. var infoTab = dialogDefinition.getContents( 'info' ); var browseButton = infoTab.get( 'browse' ); browseButton.hidden = false; dialogDefinition.onLoad = function () { new AjaxUpload( $(".cke_dialog_body .cke_dialog_page_contents:first .cke_dialog_ui_button:first") , { action: 'actions.php?item=imageCKEditorUpload&action=upload', onSubmit: function( file, extension ) { //Loader $.nyroModalManual({ zIndexStart: 10010, minWidth: 100, // Minimum width minHeight: 100, // Minimum height closeButton: '', showTransition: null, content: '<div id="nyroModalLoader"></div>' }); }, onComplete: function(file, response) { //alert( response ); $(".cke_dialog_body .cke_dialog_page_contents:first input.cke_dialog_ui_input_text:first").val( jQuery.trim( response ) ); $.nyroModalRemove(); } }); } } });