WordPress Editor: Detect active tab (Visual or Text)

I have a situation when I am setting and getting contents to and from WordPress Editor (TinyMCE 4 as in WordPress 3.9) and a normal textarea. I am doing this because there are just too many rich text editors in my page and I can not put a wp_editor on every textarea. So I’ve come up with the approach of printing just one wp_editor and dynamically set and get contents between this and other textareas.

So far I have written the following code snippet:

var Plugin = {
    editorOpen : function(settings_box, container, origin) {
        //Check wp_editor
        var wp_editor_textarea = $(settings_box).find( 'textarea.wp_editor' ).eq(0);
        if( wp_editor_textarea.length ) {
            // The wrapping div of the wp_editor
            // This is just how I am printing stuff
            var wp_editor_container = container.find('.ipt_uif_builder_wp_editor');

            // To get the RAW tinyMCE editor
            // We are simply searching for the first textarea inside the wrapper
            // This works
            var tmce_textarea = wp_editor_container.find('textarea').eq(0);

            // Init the tinyMCE API
            var editor = tinyMCE.get( tmce_textarea.attr('id') );

            // Get the original content
            var content = wp_editor_textarea.val();

            // Show it
            wp_editor_container.css({position : 'static', 'left' : 'auto'});

            // Set the content
            // The problem with this is
            // Even if the user has clicked TEXT tab, editor will still be a tinyMCE instance
            // So this method can not be used to set the values
            // Since we can not know like this if the user is on visual tab or text tab
            // And the following snippet will always set the value on visual tab
            if ( editor && editor instanceof tinymce.Editor ) {
                editor.setContent( switchEditors.wpautop( content ) );
                editor.save({ no_events: true });
                console.log( 'Setter in TinyMCE: ' + switchEditors.wpautop( content ) );
            } else {
                tmce_textarea.val( switchEditors.pre_wpautop(content) );
                console.log('Setter in TextArea: ' + switchEditors.pre_wpautop(content));
            }

            // But I have figured out an ugly hack to do it anyway
            if ( tmce_textarea.is(':visible') ) {
                // TEXT TAB active
            } else {
                // VISUAL TAB active
            }
        }
    },

    editorClose : function(settings_box, container) {
        //Check wp_editor
        var wp_editor_textarea = $(settings_box).find('textarea.wp_editor').eq(0);
        if(wp_editor_textarea.length) {
            // Get the tmce textarea
            var tmce_textareaID = container.find('.ipt_uif_builder_wp_editor textarea').eq(0).attr('id');
            var wp_editor_container = container.find('.ipt_uif_builder_wp_editor');
            var tmce_textarea = wp_editor_container.find('textarea').eq(0);
            var content;
            var editor = tinyMCE.get(tmce_textareaID);

            // Get the content
            // Here again we may get the wrong content
            // Since the content is always fetched from tinyMCE editor
            // even if the TEXT tab is active
            if( editor && editor instanceof tinymce.Editor ) {
                content = switchEditors.pre_wpautop( editor.getContent() );
                console.log('Getter in TinyMCE: ' + content);
            } else {
                content = $( '#' + tmce_textareaID ).val();
                console.log( 'Getter in TextArea: ' + content );
            }

            // But I have figured out an ugly hack to do it anyway
            if ( tmce_textarea.is(':visible') ) {
                // TEXT TAB active
            } else {
                // VISUAL TAB active
            }

            //Update it
            wp_editor_textarea.val(content);

            //Hide the wp_editor
            container.find('.ipt_uif_builder_wp_editor').css({position : 'absolute', 'left' : -9999});
        }
    }
};

As you can see, I am not exactly getting to know which tab (TEXT or VISUAL) is active through some API. The only way I could think of doing this is marked as the ugly hack.

Any thoughts and help is very welcome. Thank you for taking the time to read this 🙂

EDIT: For the sake of simplicity, what I am asking is “For a given tinyMCE instance in WordPress editor, how do we know which tab (Visual or Text) is active?”