Skip to content
This repository has been archived by the owner on Sep 29, 2020. It is now read-only.

Using custom editor to edit files within elfinder

Josh Schmidt edited this page Oct 30, 2012 · 1 revision

edit command supports any (I hope) WYSIWYG.

Here is simple example for TinyMCE:

// init 
tinyMCE.init({});

// elfinder options
var opts = {
  commandsOptions : {
    edit : {
      editors : [
        {
          mimes : ['text/html'],  // add here other mimes if required
          load : function(textarea) {
            tinyMCE.execCommand('mceAddControl', true, textarea.id);
          },
          close : function(textarea, instance) {
            tinyMCE.execCommand('mceRemoveControl', false, textarea.id);
          },
          save : function(textarea, editor) {
            textarea.value = tinyMCE.get(textarea.id).selection.getContent({format : 'html'});
            tinyMCE.execCommand('mceRemoveControl', false, textarea.id);
          }
        },
        {...} // probably other editors for other mime types
      ]
    }
  }
}

Options

  • mimes - enable current editor only on next mime types
  • load - calls after edit dialog shown
  • close - before dialog close
  • save - before send textarea content to backend

This is just example to get the idea how it works (I'm not TinyMCE guru so maybe somebody can fix the code).

Others WYSIWYGs examples are welcome.