/// class PD.Manage.Modules.Maintenance.MaintenanceMessage
// using PD.Web.UI.Controls.Control

PD.Manage.Modules.Maintenance.MaintenanceMessage =
PD.Web.UI.Controls.Control.extend({

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

    _editor: null,

    //===================================
    // PROPERTIES
    //===================================

    get_changeButton: function () {
        return this.get_node().find("BUTTON[data-id=change]");
    },

    get_resetButton: function () {
        return this.get_node().find("BUTTON[data-id=reset]");
    },

    get_editableText: function () {
        return this.get_node().find("DIV[data-id=editable-text]");
    },

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

    onActivate: function () {

        var that = this;

        this.get_changeButton().on("click", _.bind(this._changeButton_onClick, this));
        this.get_resetButton().on("click", _.bind(this._resetButton_onClick, this));

        $("body").append("<link rel='stylesheet' type='text/css' href='" + PD.Path.resolve("~/areas/shared/assets/internal-unbundled/message-screen.css") + "'>");

    },

    _changeButton_onClick: function (e) {

        var that = this;

        PD.Web.UI.TextEditorDialog.open({
            content: function (callback) {

                PD.ajax({
                    type: "GET",
                    url: PD.Path.resolve("~/Manage/Maintenance/GetMessage"),
                    success: function (e) {
                        callback(e.content);
                    }
                });

            },
            callbacks: {
                ok: function (sender, e) {

                    PD.ajax({
                        type: "POST",
                        url: PD.Path.resolve("~/Manage/Maintenance/SetMessage"),
                        data: {
                            content: e.content
                        },
                        success: function () {
                            that.get_editableText().html(e.content);
                        }
                    });

                }
            }
        });

    },

    _resetButton_onClick: function (e) {

        var that = this,
            defaultMessage = this.get_options().settings.defaultMessage;

        PD.ajax({
            type: "POST",
            url: PD.Path.resolve("~/Manage/Maintenance/SetMessage"),
            data: {
                content: null
            },
            success: function () {
                that.get_editableText().html(defaultMessage);
            }
        });

    },

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

    template: function () {

        var settings = this.get_options().settings,
            preview = this.get_options().preview;

        return [
            "<div>",
               "<div data-id='message-title' class='-pd-title-compact' style='position:absolute;top:10px;left:320px;height:30px;right:10px;border-bottom-width:0;'>",
                    "Maintenance Message Preview",
                "</div>",
                "<div data-id='message' style='position:absolute;top:40px;left:320px;bottom:50px;right:10px;border:1px solid #DDDDDD;box-sizing:border-box;overflow:auto;'>",
                    "<table class='message-screen'>",
                        "<tbody>",
                            "<tr>",
                                "<td>",
                                    "<div class='-pd-application-title'>",
                                        preview.applicationName,
                                    "</div>",
                                    "<div class='-pd-message-content'>",
                                        "<div class='-pd-message-icon' style='background-image:url(" + PD.Path.resolve("~/areas/shared/assets/internal/icons/256x256/" + preview.icon) + ");'>",
                                            "<div class='-pd-message-tagline'>",
                                                preview.tagline,
                                            "</div>",
                                        "</div>",
                                        "<div class='-pd-message-text'>",
                                            "<div class='-pd-message-title'>",
                                                preview.title,
                                            "</div>",
                                            "<div data-id='editable-text'>",
                                                settings.message || settings.defaultMessage,
                                            "</div>",
                                        "</div>",
                                    "</div>",
                                "</td>",
                            "</tr>",
                        "</tbody>",
                    "</table>",
                "</div>",
                "<div data-id='message-button-deck' style='position:absolute;height:30px;left:320px;bottom:10px;right:10px;box-sizing:border-box;text-align:center;'>",
                    "<button data-id='change' style='box-sizing:border-box;font-size:12px;height:30px;margin-right:10px;'>Change Message</button>",
                    "<button data-id='reset' style='box-sizing:border-box;font-size:12px;height:30px;'>Reset Message</button>",
                "</div>",
            "</div>"
        ];
    }

});