/// class ProspectDirector.Web.UI.FeatureSets.Editors.Macro.RichTextEditor
/// using ProspectDirector.Web.UI.FeatureSets.MacroEditorBase

ProspectDirector.Web.UI.FeatureSets.Editors.Macro.RichTextEditor =
ProspectDirector.Web.UI.FeatureSets.MacroEditorBase.extend({

    //==============================
    // FIELDS
    //==============================

    _editor: null,
    _subscriber: null,

    //==============================
    // PROPERTIES
    //==============================
    
    get_node: function () {
        return $("#" + this.getId());
    },

    get_editorContainer: function () {
        return this.get_node().find("[data-id=editor-container]");
    },

    get_mceNode: function () {
        return this.get_node().find(".mce-tinymce");
    },

    //==============================
    // INITIALIZERS
    //==============================
    
    _init_editor: function () {

        var that = this;

        tinymce.init({
            selector: "#" + this.getId() + " > DIV > TEXTAREA",
            apply_source_formatting: true,
            plugins: "link hr textcolor colorpicker",
            menubar: false,
            statusbar: false,
            toolbar: [
                "undo redo | fontselect fontsizeselect forecolor backcolor | bold italic | alignleft aligncenter alignright | bullist numlist hr | outdent indent | link unlink"
            ],
            color_picker_callback: function (callback, value) {

                ProspectDirector.Web.UI.FeatureSets.Editors.ColorEditorDialog.open({
                    config: {
                        title: "Text Color"
                    },
                    data: {
                        hex: "#000000"
                    },
                    callbacks: {
                        ok: function (sender, e) {
                            callback(e);
                        }
                    }
                });

            },
            fontsize_formats: "8px 10px 11px 12px 13px 14px 15px 16px 17px 18px 19px 20px 22px 24px 28px 32px 36px 40px",
            content_css: Jade.Path.resolve("~/areas/shared/assets/external-unbundled/tinymce/tinymce-content.css?" + Jade.Guid.new().toString()),
            setup: function (editor) {

                that._editor = editor;

                editor.on('init', function (e) {
                    that._editor_loadContent();
                    that.get_mceNode().css({
                        borderWidth: 0,
                        borderStyle: "none"
                    });
                });

                editor.on('change', $.proxy(that._editor_onChange, that));

            }
        });

        this._subscriber = _.bind(function (sender, e) {

            if (e.name === "backgroundColor") {
                that._setEditorBackgroundColor(e.value);
            }
            
        }, this);

        this.get_eventBus().subscribe("color-editor/value/change", this._subscriber);

    },

    //==============================
    // EVENT HANDLERS
    //==============================

    _editor_onChange: function (e) {
        this.setPrimaryValue(this._editor.getContent());
    },

    //==============================
    // PUBLIC METHODS
    //==============================

    activate: function () {

        var that = this;
        
        this._init_editor();

        setTimeout(function () {
            that._editor_sizeToFit();
        }, 300);

    },

    render: function () {

        return [
            "<div id=\"" + this.getId() + "\">",
            "<div data-id='editor-container' style='position:absolute;top:0;left:0;right:0;bottom:0;overflow:hidden;'>",
            "<textarea></textarea>",
            "</div>",
            "</div>"
        ].join("");

    },

    size: function (e) {
        this._editor_sizeToFit();
    },

    destroy: function () {
        if (this._editor != null) {
            this._editor.destroy();
        }
        if (_.isFunction(this._subscriber)) {
            this.get_eventBus().unsubscribe("color-editor/value/change", this._subscriber);
        }
    },

    //==============================
    // PRIVATE METHODS
    //==============================

    _editor_loadContent: function () {

        var content = this.getPrimaryValue();

        this._setInitialEditorBackgroundColor();

        if (content == null) {
            return;
        }

        if (_.isString(content)) {
            this._editor.setContent(content);
            return;
        }

    },

    _editor_sizeToFit: function () {

        var $container = this.get_editorContainer(),
            max = $container.outerHeight() - 4;

        max -= $container.find('.mce-menubar.mce-toolbar').outerHeight();
        max -= $container.find('.mce-toolbar-grp').outerHeight();
        $container.find('.mce-edit-area').height(max);
        $container.find('IFRAME').height(max);

    },

    _setEditorBackgroundColor: function (value) {
        if (this._editor != null) {
            this._editor.getBody().style.backgroundColor = value || "#FFFFFF";
        }
    },

    _setInitialEditorBackgroundColor: function () {
        try {
            this._setEditorBackgroundColor(this.getValue("backgroundColor"));
        } catch {
        }
    }

});