Hinzufügen eines benutzerdefinierten Kontextmenüs zu elFinder

Question

Ich benutze elfinder und möchte neue Funktionen hinzufügen, indem ich einen Befehl zum Kontextmenü hinzufüge. Ich habe eine Lösung für den GitHub Issue Tracker des Projekts gefunden, aber ich kann es nicht zum Laufen bringen. Hier ist, was ich mache:

var elf; 
jQuery().ready(function() { 
    elFinder.prototype._options.commands.push('editimage'); 
    elFinder.prototype._options.contextmenu.files.push('editimage'); 
    elFinder.prototype.i18.en.messages['cmdeditimage'] = 'Edit Image';   
    elFinder.prototype.i18.de.messages['cmdeditimage'] = 'Bild bearbeiten'; 
    elFinder.prototype.commands.editimage = function() { 
     this.exec = function(hashes) { 
      console.log('hallo'); 
     } 
    } 
    elf = jQuery('#elfinder').elfinder({ 
    ... 
    //elfinder initialization 

Der Kontextmenüeintrag wird nicht angezeigt, keine Fehlermeldung befindet sich in der Konsole. Ich habe auch versucht, editiumbeim unter kontextmenü -> "dateien" im init-teil zu setzen, falls das durch die initialisierung überschrieben wurde.

Answer 1

fand ich die Lösung: Die Beispiele zeigen nicht die Tatsache, dass Sie Notwendigkeit eine Funktion this.getstate innerhalb der elFinder.prototype.commands.yourcommand Funktion aufgerufen haben. Es gibt 0 zurück, wenn das Symbol aktiviert ist, und -1, wenn es deaktiviert ist.

So ist der vollständige Code Ihrer eigenen Menüpunkt oder Kontextmenüpunkt zum Hinzufügen sieht wie folgt aus:

var elf; 
jQuery().ready(function() { 

    elFinder.prototype.i18.en.messages['cmdeditimage'] = 'Edit Image';   
    elFinder.prototype.i18.de.messages['cmdeditimage'] = 'Bild bearbeiten'; 
    elFinder.prototype._options.commands.push('editimage'); 
    elFinder.prototype.commands.editimage = function() { 
     this.exec = function(hashes) { 
      //do whatever 
     } 
     this.getstate = function() { 
      //return 0 to enable, -1 to disable icon access 
      return 0; 
     } 
    } 
    ... 
    elf = jQuery('#elfinder').elfinder({ 
     lang: 'de',    // language (OPTIONAL) 
     url : '/ext/elfinder-2.0-rc1/php/connector.php', //connector URL 
     width:'100%', 
     uiOptions : { 
      // toolbar configuration 
      toolbar : [ 
       ... 
       ['quicklook', 'editimage'], 
       /*['copy', 'cut', 'paste'],*/ 
       ... 
      ]}, 
     contextmenu : { 
      ... 
      // current directory file menu 
      files : [ 
       'getfile', '|','open', 'quicklook', 'editimage', ... 
      ] 
     } 
    }).elfinder('instance'); 

}); 

hoffe, das hilft jemand mit dem gleichen Problem.

Answer 2

Danke für die Antwort, großartig!

Eine Sache, die nicht klar war, war, wie die Variablen durchgehen.

Also, für alle anderen, die diese Seite findet ....

elFinder.prototype.commands.editpres = function() { 
    this.exec = function(hashes) { 
     var file = this.files(hashes); 
     var hash = file[0].hash; 
     var fm = this.fm; 
     var url = fm.url(hash); 
     var scope = angular.element("body").scope(); 
     scope.openEditorEdit(url); 
    } 
    // Getstate configured to only light up button if a file is selected. 
    this.getstate = function() { 
     var sel = this.files(sel), 
     cnt = sel.length; 
     return !this._disabled && cnt ? 0 : -1; 
    } 
} 

Ihr Symbol Um zu zeigen, fügen Sie die folgende in der CSS-Datei:

.elfinder-button-icon-editpres { background:url('../img/icons/editpres.png') no-repeat; }