var Qs_CkEditor = {
    _elementInstances: {},

    getElementInstance: function (elementId)
    {
        if (typeof this._elementInstances[elementId] !== 'undefined') {
            return this._elementInstances[elementId];
        }
        return false;
    },

    addElementInstance: function (elementId, instance)
    {
        this._elementInstances[elementId] = instance;
    }
};

var Qs_Form_Element_CkEditor = qs.createObject();

Qs_Form_Element_CkEditor.prototype = {
    options: null,

    initialize: function (options)
    {
        this.popupButton = undefined;
        if (typeof CKEDITOR == 'undefined') {
            alert('CKEDITOR is undefined');
            return false;
        }

        if (typeof options.id == 'undefined') {
            alert('Element ID is undefined');
            return false;
        }

        this.options = options;

        if (typeof this.options.mode != 'undefined') {
            if (this.options.mode == 'edit') {
                this.setEditMode();
            } else if (this.options.mode == 'popup') {
                this.setPopupMode();
            }
        }

        Qs_CkEditor.addElementInstance(this.options.id, this);
    },

    setEditMode: function ()
    {
        if (typeof CKEDITOR.instances[this.options.id] == 'undefined') {
            CKEDITOR.replace(this.options.id, this.getEditorConfig());
        }
        this.options.mode = 'edit';
        $('#' + this.options.id + '-element').attr('class', 'ckeditor_edit');
    },

    setPopupMode: function ()
    {
        $('#' + this.options.id + '-modal').on(
            'show', _.bind(this.popupOnShow, this)
        ).on(
            'hide', _.bind(this.popupOnHide, this)
        );
        this.popupButton = $('#' + this.options.id + '-popup-btn');
        this.options.mode = 'popup';
        $('#' + this.options.id + '-element').attr('class', 'ckeditor_popup');
    },

    popupOnShow: function () {
        if (typeof CKEDITOR.instances[this.options.id] == 'undefined') {
            var config = this.getEditorConfig();
            config.startupFocus = true;
            CKEDITOR.replace(this.options.id, config);
        } else {
            CKEDITOR.instances[this.options.id].focus();
        }
    },

    popupOnHide: function () {
        if (typeof CKEDITOR.instances[this.options.id] != 'undefined') {
            var value = CKEDITOR.instances[this.options.id].getData();
            this.popupButton.toggleClass('htmleditor-not-empty', value.length > 0);
        }
    },

    getEditorConfig: function ()
    {
        var config = {};
        var customConfigMethod = 'get' + this.options.config.toolbar + 'Config';
        if (typeof this[customConfigMethod] == 'function') {
            config = this[customConfigMethod]();
        }
        config = $.extend(this.options.config, config);
        return config || {};
    },

    getSmartyConfig: function ()
    {
        var config = {protectedSource: CKEDITOR.config.protectedSource};

        // smarty tags
        config.protectedSource.push( /\{\/?(capture|config|foreach|if|else|include|insert|literal|php|section|strip|assign|counter|cycle|debug|eval|fetch|html|mailto|math|textformat)([^\}]*)\}/gi );

        return config;
    },

    getFlashConfig: function ()
    {
        // Our intention is force all formatting features to use CSS classes or
        // semantic aware elements.

        var config = {};

        /**
         * Core styles.
         */
        config.coreStyles_bold = { element : 'b', overrides : 'strong' };
        config.coreStyles_italic = { element : 'i', overrides : 'em' };
        config.coreStyles_underline = { element : 'u' };

        /**
         * Font face
         */
            // Define the way font elements will be applied to the document. The "span"
            // element will be used. When a font is selected, the font name defined in the
            // above list is passed to this definition with the name "Font", being it
            // injected in the "class" attribute.
            // We must also instruct the editor to replace span elements that are used to
            // set the font (Overrides).
        config.font_style = { element : 'font', attributes : { 'face' : '#(font)' } };

        /**
         * Font sizes.
         * The CSS part of the font sizes isn't used by Flash, it is there to get the
         * font rendered correctly in FCKeditor.
         */
        config.fontSize_sizes = '8/8px;9/9px;10/10px;11/11px;12/12px;14/14px;16/16px;18/18px;20/20px;22/22px;24/24px;26/26px;28/28px;36/36px;48/48px;72/72px';
        config.fontSize_style =
        {
            element    : 'font',
            attributes : { 'size' : '#(size)' },
            styles     : { 'font-size' : '#(size)' }
        };

        /**
         * Font colors.
         */
        config.colorButton_enableMore = true;
        config.colorButton_foreStyle =
        {
            element    : 'font',
            attributes : { 'color' : '#(color)' }
        };

        /**
         * Flash specific formatting settings.
         */
        config.basicEntities = false;
        config.entities = false;

        return config;
    }
};