static/admin/TinyMCETextArea.js
function () {
        var me = this;

        me.callParent(arguments);

        // If an element is a child of an invisible container like tab,
        // there are a number of issues which make the life complicated:
        //
        // - The element might not be completely rendered; it will be
        //   completely rendered only when the container becomes visible.
        // - The size of the element might be unknown until the container becomes
        //   visible. If you do size adjustment, while the container is
        //   not visible, the size might be calculated and set incorrectly.
        // - No show/hide event is fired for the element self if the container
        //   becomes visible or hidden. The event is fired only for that parent
        //   container, which is being actively shown or hidden.
        // - You have to attach the event handler to the correct parent container
        //   and do size adjustment only if the container becomes visible.
        //
        // We check whether our TinyMCETextArea is a child of a tab panel. If yes,
        // we attach the event handler to the tab change event and do
        // size adjustment if the parent tab, which contains our TinyMCETextArea,
        // becomes visible.
        //
        // PS: It will not work if you have a tab control within another tab control!

        var tabpanel = me.findParentByType('tabpanel');
        if (tabpanel) {
            tabpanel.on('tabchange', function (tabPanel, newCard, oldCard, eOpts) {

                var myCard = me.findParentBy(function (cont, elm) {
                    return cont.getId() === newCard.getId();
                });
                if (myCard) {
                    me.syncEditorSize(me.lastWidth, me.lastHeight);
                }
            }, me);
        }

        me.on('blur', function (elm, ev, eOpts) {

            var ctrl = document.getElementById(me.getInputId());

            if (me.wysiwygIntialized) {
                var ed = tinymce.get(me.getInputId());

                // In the HTML text modus, the contents should be
                // synchronized upon the blur event.
                if (ed && ed.isHidden()) {
                    if (ctrl) {
                        me.positionBeforeBlur = { start: ctrl.selectionStart, end: ctrl.selectionEnd };
                    }

                    ed.load();
                }
            }
            else {
                if (ctrl) {
                    me.positionBeforeBlur = { start: ctrl.selectionStart, end: ctrl.selectionEnd };
                }
            }
        }, me);

        me.on('resize', function (elm, width, height, oldWidth, oldHeight, eOpts) {
            /*
             alert('width:' + width + '\n' +
             'height:' + height + '\n' +
             'oldWidth:' + oldWidth + '\n' +
             'oldHeight:' + oldHeight
             );
             */

            if (elm.hasVisibleLabel() && (elm.labelAlign === 'left' || elm.labelAlign === 'right')) {
                width = width - (elm.labelWidth + elm.labelPad);
            }

            me.lastWidth = width;
            me.lastHeight = height;

            if (!me.noWysiwyg && !me.wysiwygIntialized) {
                me.initEditor();
            }
            else {
                me.syncEditorSize(me.lastWidth, me.lastHeight);
            }
        }, me);
    }
function () {
        var me = this;

        me.callParent(arguments);

        // If an element is a child of an invisible container like tab,
        // there are a number of issues which make the life complicated:
        //
        // - The element might not be completely rendered; it will be
        //   completely rendered only when the container becomes visible.
        // - The size of the element might be unknown until the container becomes
        //   visible. If you do size adjustment, while the container is
        //   not visible, the size might be calculated and set incorrectly.
        // - No show/hide event is fired for the element self if the container
        //   becomes visible or hidden. The event is fired only for that parent
        //   container, which is being actively shown or hidden.
        // - You have to attach the event handler to the correct parent container
        //   and do size adjustment only if the container becomes visible.
        //
        // We check whether our TinyMCETextArea is a child of a tab panel. If yes,
        // we attach the event handler to the tab change event and do
        // size adjustment if the parent tab, which contains our TinyMCETextArea,
        // becomes visible.
        //
        // PS: It will not work if you have a tab control within another tab control!

        var tabpanel = me.findParentByType('tabpanel');
        if (tabpanel) {
            tabpanel.on('tabchange', function (tabPanel, newCard, oldCard, eOpts) {

                var myCard = me.findParentBy(function (cont, elm) {
                    return cont.getId() === newCard.getId();
                });
                if (myCard) {
                    me.syncEditorSize(me.lastWidth, me.lastHeight);
                }
            }, me);
        }

        me.on('blur', function (elm, ev, eOpts) {

            var ctrl = document.getElementById(me.getInputId());

            if (me.wysiwygIntialized) {
                var ed = tinymce.get(me.getInputId());

                // In the HTML text modus, the contents should be
                // synchronized upon the blur event.
                if (ed && ed.isHidden()) {
                    if (ctrl) {
                        me.positionBeforeBlur = { start: ctrl.selectionStart, end: ctrl.selectionEnd };
                    }

                    ed.load();
                }
            }
            else {
                if (ctrl) {
                    me.positionBeforeBlur = { start: ctrl.selectionStart, end: ctrl.selectionEnd };
                }
            }
        }, me);

        me.on('resize', function (elm, width, height, oldWidth, oldHeight, eOpts) {
            /*
             alert('width:' + width + '\n' +
             'height:' + height + '\n' +
             'oldWidth:' + oldWidth + '\n' +
             'oldHeight:' + oldHeight
             );
             */

            if (elm.hasVisibleLabel() && (elm.labelAlign === 'left' || elm.labelAlign === 'right')) {
                width = width - (elm.labelWidth + elm.labelPad);
            }

            me.lastWidth = width;
            me.lastHeight = height;

            if (!me.noWysiwyg && !me.wysiwygIntialized) {
                me.initEditor();
            }
            else {
                me.syncEditorSize(me.lastWidth, me.lastHeight);
            }
        }, me);
    }
-----------------------------------------------------------------