TinyMCE4 file_picker_callback - restituisce parametri aggiuntivi

Question

Sto utilizzando il mio raccoglitore di file personalizzato con la nuova funzione file_picker_callback di TinyMCE 4. La documentazione su questo non è eccezionale, quindi il merito va a Fred per avermi portato così lontano - https://stackoverflow.com/a/24571800/2460995

Il selettore di file personalizzato sta funzionando e quando si fa clic su un'immagine riempie la "Fonte" e anche le "Dimensioni" ". Mi sto solo chiedendo se c'è un modo per riempire automaticamente anche il campo "Descrizione dell'immagine".

Le informazioni per le immagini vengono generate da una tabella di database, quindi ho già una descrizione e sarebbe bello riempirla automaticamente per l'utente. Dopo aver provato vari modi di restituire i dati, sto cercando di capire come farlo.

Codice in materia di TinyMCE:

tinymce.init({ 
    ... 
    file_picker_callback: function(callback, value, meta) { 
     myImagePicker(callback, value, meta); 
    } 
}); 

function myImagePicker(callback, value, meta) { 
    tinymce.activeEditor.windowManager.open({ 
     title: 'Image Browser', 
     url: '/media/browser/1?type=' + meta.filetype, 
     width: 800, 
     height: 550, 
    }, { 
     oninsert: function (url) { 
      callback(url); 
     } 
    }); 
}; 

Codice per il Selettore Custom File:

$(function(){ 
    $('.img').on('click', function(event){ 
     mySubmit('/upload/' + $(this).data('filename')); 
    }); 
}); 

function mySubmit(url) { 
    top.tinymce.activeEditor.windowManager.getParams().oninsert(url); 
    top.tinymce.activeEditor.windowManager.close(); 
} 

mia conoscenza javascript non il più grande è ancora come io sono abbastanza nuovo ad esso, quindi se si potrebbe per favore illustrare eventuali risposte con esempi e/o logica chiara che sarebbe molto utile e molto apprezzata.

Answer 1

ho avuto lo stesso problema, e si avvicinò con la seguente soluzione:

1. aggiornamento la funzione myImagePicker essere (notare la nuova objVals parametro alla funzione oninsert):

   function myImagePicker(callback, value, meta) { 
       tinymce.activeEditor.windowManager.open({ 
        title: 'Image Browser', 
        url: '/media/browser/1?type=' + meta.filetype, 
        width: 800, 
        height: 550, 
       }, { 
        oninsert: function (url, objVals) { 
         callback(url, objVals); 
        } 
       }); 
   }; 
   

2. Aggiornare la funzione mySubmit (notare il parametro objVals passato a oninsert):

   function mySubmit (url, objVals) { 
       top.tinymce.activeEditor.windowManager.getParams().oninsert(url, objVals); 
       top.tinymce.activeEditor.windowManager.close(); 
       return false; 
   } 
   

3. Aggiornare i luoghi che si chiamano mySubmit per riempire-nell'oggetto objVals.

   Ad esempio:

   mySubmit("https://google.com", { text: "Go To Google", target: '_blank' }); 
   

   Le proprietà di fill-in per objVals cambiamento sulla base del tipo di finestra di chiamata, e sono (parzialmente) documentati here.

   Per la finestra di link:

   mySubmit("https://google.com", { text: "Go To Google", target: '_blank' }); 
   

   Per la finestra di immagine:

   mySubmit("image.jpg", { alt: "My image" }); 
   

   Per la mediadialog:

   mySubmit("movie.mp4", {source2: 'movie-alt.ogg', poster: 'movie-image.jpg'});