Using CodeMirror as elFinder editor

Question

CodeMirror with elFinder! Wasn't able to find an example anywhere so had to figure it out. It turns out to be really simple in the end, but it took a bit to figure out so I'm posting this because someone out there is bound to need it eventually.

$().ready(function() {

    var elf = $('#elfinder').elfinder({
        url : 'elfinder-2.0-rc1/php/connector.php',

        commandsOptions: {

            edit : {
                // list of allowed mimetypes to edit
                // if empty - any text files can be edited
                mimes : ['text/plain', 'text/html', 'text/javascript', 'text/css'],

                // you can have a different editor for different mimes
                editors : [{

                    mimes : ['text/plain', 'text/html', 'text/javascript', 'text/css'],

                    load : function(textarea) {

                        this.myCodeMirror = CodeMirror.fromTextArea(textarea, {
                            lineNumbers: true,
                            theme: "xq-dark" 
                        })                                        
                    },

                    close : function(textarea, instance) {
                        this.myCodeMirror = null;
                    },


                    save : function(textarea, editor) {                                      
                        textarea.value = this.myCodeMirror.getValue();
                        this.myCodeMirror = null;
                    }

                } ] //editors
            } //edit

        } //commandsoptions

    }).elfinder('instance');

});

Answer 1

The answer is above! I should really have asked this as a question and then answered it. Sorry.