GNS.register = {};

new Vue({
    el: '[data-auth-register-block]',
    data: {
        name: '',
        email: '',
        password: '',
        repeat_password: '',
        isSubmit: false,
        errorMessage: ''
    },
    mounted: function () {
        var self = this;

        GNS.register.$form = $(self.$el).find('form');

        GNS.register.$form.validate({
            onsubmit: false,
            ignore: false,
            errorElement: 'span',
            focusCleanup: true,
            onfocusout: false,
            onkeyup: false,
            onclick: false,
            rules: {
                'register-name': {
                    required: true,
                    minlength: 2,
                    maxlength: 191
                },
                'register-email': {
                    required: true,
                    email: true,
                    maxlength: 191
                },
                'register-password': {
                    required: true,
                    minlength: 8,
                    maxlength: 191,
                    nowhitespace: true
                },
                'register-repeat-password': {
                    required: true,
                    minlength: 8,
                    maxlength: 191,
                    nowhitespace: true,
                    equalTo: '#register-password'
                }
            },
            errorPlacement: function (error, element) {
                error.addClass('form-el-error-message');
                element.closest('.form-group').append(error);
            },
            highlight: function (element, errorClass, validClass) {
                $(element).addClass('form-el-error');
            },
            unhighlight: function (element, errorClass, validClass) {
                $(element).removeClass('form-el-error');
            }
        });
    },
    methods: {
        submit: function () {
            var self = this;

            if (self.errorMessage) {
                self.errorMessage = '';
            }

            if (self.isSubmit) {
                return false;
            } else if (!GNS.register.$form.valid()) {
                return false;
            }

            self.isSubmit = true;

            $.ajax({
                url: '/auth/register',
                type: 'POST',
                data: {
                    name: self.name,
                    email: self.email.toLocaleLowerCase(),
                    password: sha1(self.password),
                    password_confirmation: sha1(self.repeat_password),

                    language: GNS.language,
                    user_location_id: GNS.userLocationId,
                    user_shop_id: GNS.userShopId,
                    user_delivery_address: GNS.userDeliveryAddress
                },
                success: function (data) {
                    if (data.status === 'already-authenticated'
                        || data.status === 'invalid-input'
                        || data.status === 'user-already-registered'
                        || data.status === 'register-failed') {

                        self.errorMessage = data.message;
                    } else if (data.status === 'success') {
                        self.reset();
                        $('#auth_modal').modal('hide');

                        GNS.notification.show(data.message);
                    }

                    self.isSubmit = false;

                    if (GNS.isDebug) {
                        console.log('/auth/register[success]:', data);
                    }
                },
                error: function (error) {
                    self.isSubmit = false;

                    if (GNS.isDebug) {
                        console.log('/auth/register[error]:', error.responseJSON);
                    }
                }
            });
        },
        reset: function () {
            this.name = '';
            this.email = '';
            this.password = '';
            this.repeat_password = '';
        }
    }
});