define([
    'Global',
    'Text!../html/templates/VAAC-popup.html'
],
    function (Global, template) {
        'use strict';

        return Backbone.View.extend({
            tagName: "div",
            id: "message-for-user",
            attributes: {
                "data-role": "popup",
                "data-dismissible": "false",
                "class": "ui-corner-all"
            },

            initialize: function (options) {
                this.options = options || {};
	            this.alertMessage = options && options.alertMessage ? options.alertMessage : "";
	            this.alertMessageLine2 = options && options.alertMessageLine2 ? options.alertMessageLine2 : "";
                this.message = options && options.message ? options.message : "";
	            this.title = options && options.title ? options.title : "";
                this.callBacks = options && options.callBacks ? options.callBacks : [];
	            this.checkboxRadios = options && options.checkboxRadios ? options.checkboxRadios : [];
	            this.checkboxRadioType = options && options.checkboxRadioType ? options.checkboxRadioType : "radio";
	            this.legend = options && options.legend ? options.legend : "";

                this.template = _.template(template);
            },

            render: function () {
                var $container = getMainContent(),
	                options = {
		                alertMessage: this.alertMessage,
		                alertMessageLine2: this.alertMessageLine2,
		                checkboxRadios: this.checkboxRadios,
		                checkboxRadioType: this.checkboxRadioType,
		                legend: this.legend,
		                message: this.message,
		                title: this.title
	                };

                this.$el
                    .empty()
                    .append(this.template(options));

                $container
                    .append(this.$el);

                this.$el
                    .trigger('create')
                    .popup()
                    .popup('open');

                $('#VAAC-cancel-btn').focus();

                return this;
            },

            events: {
                "click #VAAC-confirm-btn, #VAAC-close-btn": "handleAction",
                'change [name="VAAC-check-radio"]': "enableSaveBtn"
            },

            handleAction: function(e) {
	            var $targetBtn = $(e.currentTarget),
		            btnIndex = $targetBtn.data("index");

	            if (_.isFunction(this.callBacks[btnIndex])){
		            this.callBacks[btnIndex]();
	            }

	            this.closeMessage();
            },
            enableSaveBtn: function(){
	            if ($('#VAAC-form').serializeArray().length) {
                    $('#VAAC-confirm-btn').button('enable');
	            } else {
		            $('#VAAC-confirm-btn').button('disable');
	            }
            },
            closeMessage: function () {
                this.$el
                    .popup('close')
                    .remove();
            }
        });
    }
);