/// class PD.Manage.Modules.Resources.ResourceEditor
// using PD.Manage.Module

PD.Manage.Modules.Resources.ResourceEditor =
PD.Manage.Module.extend({

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

    _codeEditor: null,

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

    onPrepare: function () {

        var that = this;

        PD.ajax({
            url: PD.Path.resolve("~/Manage/Resources/GetFileInfo/" + this.data("targetId")),
            success: function (data) {
                that.data("content", data.content);
                that.data("label", data.name);
                that.data("mimeType", data.mimeType);
                that.data("tooltip", `<div class="-pd-module-tab-tooltip-resources">${data.folderPath}</div>`);
                that.ready();
            },
            error: function (e) {
                that.error();
                e.errorHandled = true;
            }
        });

    },

    onInit: function (e) {
        this._toolbar_init();
        this._codeEditor_init();
    },

    onComplete: function () {
        this._codeEditor.content(this.data("content"));
        this._codeEditor.setStyle(this.data("mimeType"));
        this._codeEditor.focus();

        PD.context.get_default().get_commands().setState({
            "pd/resource-editor": {
                editor: this._codeEditor
            }
        });

    },

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

    onFocus: function () {
        this._codeEditor.focus();
    },

    //===================================
    // PROTECTED METHODS
    //===================================

    template: function (e) {
        return [
            "<div style='position:absolute;top:0;left:0;right:0;bottom:0;overflow:auto;padding:10px;background-color:#FFFFFF;'>",
                "<div data-id='toolbar' class='-pd-minimal-splitter' style='position:absolute;box-sizing:border-box;top:10px;height:30px;right:10px;left:10px;'></div>",
                "<div data-id='editor' class='-pd-minimal-splitter' style='position:absolute;box-sizing:border-box;top:50px;bottom:10px;right:10px;left:10px;border:1px solid #EEEEEE;'></div>",
            "</div>"
        ];
    },

    _toolbar_init: function () {

        var that = this;

        this._toolbar = new PD.Web.UI.Controls.Toolbar({
            insertAt: "[data-id=toolbar]",
            segments: [
               new PD.Manage.Modules.Resources.ResourceEditorToolbar()
            ]
        });

        this.get_children().add(this._toolbar);

    },

    _codeEditor_init: function () {

        var that = this;

        this._codeEditor = new PD.Manage.Modules.CodeEditor({
            insertAt: "[data-id=editor]",
            change: function () {

                PD.context.get_default().get_commands().setState({
                    "pd/resource-editor": {
                        editor: that._codeEditor,
                        fileId: that.data("targetId")
                    }
                });

            },
            save: function () {

            }
        });

        this.get_children().add(this._codeEditor);

    }

});