CKEditor buscador de imágenes personalizado

Question

Estoy usando CKEditor y he implementado con éxito el navegador de imágenes personalizado habitual que apunta a mi script php. Sin embargo, esto se abre en una fea ventana emergente. Me gustaría abrirlo a través de ajax en un div en algún lugar de mi página para que se deslice y coincida con la sensación de descanso de mi cms.

Veo dos formas de hacerlo;

Un botón plugin haciendo que CKEditor que de alguna manera me abre la ventana de diálogo y pasa de nuevo de la misma manera como el pop-up hace

2) abrir mi diálogo a través de otros medios y luego pasar detalles de la imagen a CKEditor 1) , haciendo clic en una imagen o arrastrándola en el editor.

Si alguien ha hecho esto por favor hágamelo saber.

Answer 1

Acerca de higienización la etiqueta de imagen cuando se arrastra una imagen desde cualquier ventana del navegador al editor para que su CMS sabe que es una imagen local:

he implementado una solución que comprueba todas las etiquetas de imagen, y si no es una imagen local, copia la imagen a su servidor a través de una solicitud de ajax y PHP, permítame recomendarle esta opción:

Primero, no debe publicar el contenido del editor de inmediato, pero añádalo a un div oculto diferente para que pueda analizarlo con javascript, demos a este div el id de "descriptionDropPlace"

A continuación, este código se compruebe la URL de cada imagen, y si no coincide con el dominio local (mydomain aquí), que hará una petición AJAX:

var images = $('descriptionDropPlaceimg'); 
$("descriptionDropPlace img").each(function(index){ 
    var ajaxDone = false; 
    var src = $(this).attr("src"); 

     var domain = src.match(/^http:\/\/[^/]+/)[0]; 
     if(!domain.match("mydomain")){ 
      $.post('http://'+window.location.hostname+'/phpGetImage.php', { url: src }).done(function(result){ 
       $(images[index]).attr('src', result); 
       var ajaxDone = true; 
      }); 
     } 
}); 

Así phpGetImage.php se parece a esto (hay algún código para detectar si hay variables GET y para deshacerse de ellas, y para detectar si hay dos imágenes del mismo nombre pero con un directorio diferente, y guardarlas con el nombre de la URL del personaje completo escapado que se encuentran en):

$url = $_POST["url"]; 
    $headers = get_headers($url, 1); 
    if(!empty($headers['Location'])){ 
     $url = $headers['Location']; 
    } 
    $url = explode("?", $url); 
    $url = $url[0]; 
    $replace = array("/", "."); 
    $image = str_replace("http:--", "",str_replace($replace, "-", $url)); 
    $path = './uploads/yourImageDirectory/'.$image; 

    $ch = curl_init($url); 
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true); 
    $data = curl_exec($ch); 
    curl_close($ch); 
    file_put_contents($path, $data); 

    echo base_url().'uploads/yourImageDirectory/'.$image;