<script>
        var app = new Marionette.Application({});

        app.on('start', function () {
            if (Backbone.history) {
                Backbone.history.start();
            }

            //render views:
            loginView.render();
            warning.render();
        });

        /**
         * User Model:
         */
        app.User = Backbone.Model.extend({

            default: {
                userName: '',
                password: ''
            },

            type: 'post',
            dataType: 'json',
            //contentType: 'application/json',

            url: '/auth/ajaxLogin',

            validate: function (attribute) {
                if (attribute.userName.length === 0 || attribute.password.length === 0) {
                    return 'Please, make sure that email or password is not empty!';
                }
            },

            parse: function (response) {

                if(response.message)
                {
                    return warning.setAndShow(response.message);
                }

                return window.location = (response.redirect);
            }
        });

        var user = new app.User();

        /**
         * Displaying errors View:
         */
        app.warning = Marionette.ItemView.extend({

            el: '#warning',
            template: false,

            ui: {
                textHolder: '#warningMessage'
            },

            events: {
                'click .close': 'hideMe'
            },

            setAndShow: function (message) {
                this.ui.textHolder.text(message);
                this.$el.show();
            },

            hideMe: function () {
                this.$el.hide();
            }
        });

        var warning = new app.warning();

        /**
         * Login View:
         */
        app.loginView = Marionette.ItemView.extend({

            el: '#loginForm',
            template: false,
            model: user,

            initialize: function () {
                this.ui.userName = $('#userName');

                if (this.ui.userName.val() == '') {
                    this.ui.userName.focus();
                }

                //listen to errors in validation:
                this.listenTo(this.model, 'invalid', this.handleError);
            },

            ui: {
                password: '#password',
                buttonSubmit: '#submitButton'
            },

            events: {
                'click @ui.buttonSubmit': 'validateUser'
            },

            handleError: function (model, error, options) {

                return warning.setAndShow(error);
            },

            validateUser: function (e) {

                e.preventDefault();

                this.model.save({
                    userName: this.ui.userName.val().trim(),
                    password: this.ui.password.val().trim()
                }, {
                    validate: true
                });
            }
        });

        var loginView = new app.loginView();

        app.start();


    </script>