Getting current instance of Inline CKEditor in plugin command

Question

We recently moved away from tinymce, and a custom function we created there was a toolbar button that, once clicked, slid up a custom div right above the toolbar, which was appended to the toolbar on page load.

The problem now is doing the same for CKEditor when using the Inline version. Since there are a dozen of instances active at any one time, how can I fetch the instance of the current popped up inline Ckeditor so that I can append to it with jQuery, after the custom plugin button has been clicked?

Using the latest version 4.x of CKEditor.

Answer 1

It's hard to imagine what you're trying to accomplish. Anyway, you can observe which editor instance is focused (you can eventually store a reference in some variable):

CKEDITOR.on( 'instanceReady', function( event ) {
    event.editor.on( 'focus', function() {
        console.log( 'focused', this );
    });
});

After all, you can also browse editor instances since they are stored in CKEDITOR.instances object in global namespace. With this, you can find your instance by name, id, anything (i.e. previously associated with your button).

Answer 2

I'd do it like this

    var ck_instance_name = false;
    for ( var ck_instance in CKEDITOR.instances ){
        if (CKEDITOR.instances[ck_instance].focusManager.hasFocus){
            ck_instance_name = ck_instance;
            return ck_instance_name;
        }
    }