2013-07-30 19 views
7

Ich versuche, meinen eigenen Datei-Browser zu machen, so dass ich das Bild aus meiner Datei verwalten kann und es tinymce's Bild-Link-Feld senden, aber ich kann nirgendwo anders mehr Informationen darüber finden, wie ich das erreichen kann.tinymce 4: Wie erstelle ich einen eigenen Dateimanager?

Dies ist der Code ein neues Popup auf der Oberseite des Einsatz/bearbeiten zu öffnen,

file_browser_callback: function(field_name, url, type, win) { 

    //tinymce.activeEditor.windowManager.close(); 
    //console.log(field_name); 

    tinymce.activeEditor.windowManager.open({ 
     title: 'Browse Image', 
     file: "yourbrowser.php?field=" + field_name + "&url=" + url, 
     width: 450, 
     height: 305, 
     resizable : "no", 
     inline : "yes", 
     close_previous : "no", 
     buttons: [{ 
      text: 'Insert', 
      classes: 'widget btn primary first abs-layout-item', 
      disabled: true, 
      onclick: 'close' 
     }, { 
      text: 'Close', 
      onclick: 'close', 
      window : win, 
      input : field_name 
     }] 
    }); 

    return false; 
}, 

Dies ist, wo ich steckte - wie kann ich ein Bild von meinem Dateimanager auswählen und an den schicke Bildlink im Popup einfügen/bearbeiten?

Unten ist mein gesamte Code so weit,

$(document).ready(function(){ 

     $('.button').click(function(){ 

      // @reference: http://www.tinymce.com/wiki.php/api4:method.tinymce.remove# 
      if(tinyMCE.editors.length > 0) { 

       // Remove all editors bound to textareas 
       //tinymce.remove('textarea'); 

       // Remove all editors 
       tinymce.remove(); 
      } 

      $('.content').load('full.html', function() { 

       if(tinyMCE.editors.length == 0) { 

        tinymce.init({ 
         //selector: "textarea", 
         mode : "textareas", 
         editor_selector : "mce-customised", 
         editor_deselector : "not-editor", 
         theme: "modern", 
         plugins: [ 
          "advlist autolink lists link image charmap print preview hr anchor pagebreak", 
          "searchreplace wordcount visualblocks visualchars code fullscreen", 
          "insertdatetime media nonbreaking save table contextmenu directionality", 
          "emoticons template paste textcolor" 
         ], 
         toolbar1: "insertfile undo redo | styleselect | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image", 
         toolbar2: "print preview media | forecolor backcolor emoticons", 
         image_advtab: true, 

         file_browser_callback: function(field_name, url, type, win) { 

          //tinymce.activeEditor.windowManager.close(); 
          //console.log(field_name); 

          tinymce.activeEditor.windowManager.open({ 
           title: 'Browse Image', 
           file: "yourbrowser.php?field=" + field_name + "&url=" + url, 
           width: 450, 
           height: 305, 
           resizable : "no", 
           inline : "yes", 
           close_previous : "no", 
           buttons: [{ 
            text: 'Insert', 
            classes: 'widget btn primary first abs-layout-item', 
            disabled: true, 
            onclick: 'close' 
           }, { 
            text: 'Close', 
            onclick: 'close', 
            window : win, 
            input : field_name 
           }] 
          }); 

          return false; 
         }, 


         // Specifying an Absolute Image Path 
         document_base_url : "http://localhost/test/2013/js/tinymce/tinymce_4.0.2/", 
         relative_urls : false, 
         remove_script_host : false, 


         image_list: "image_list.php", 
         link_list: "link_list.php" 
        }); 

        $('.button-submit').submit_form(); 
       } 

      }); 

      return false; 
     }); 

    }); 

Die test site.

Oder, wissen Sie eine gute Datei mananger Plugin, das mit tinymce funktioniert?

+0

Haben Sie genommen einen Blick auf http://www.tinymce.com/wiki.php/TinyMCE3x:How -to_implement_a_custom_file_browser sollte einige Einblicke geben. – RMK

+0

danke. gesehen und getestet, ist es für TinyMCE 3.x. Ich arbeite an TinyMCE 4 .... – laukok

Antwort

Verwandte Themen