new Vue({
    el: '#app',
    data: {
        status: 100,
        form: {
            'Email':'',
            'FirstName':'',
            'LastName':'',
            'Language':'',
            'utmSource':''
        },
        endpoint: ''
    },
    mounted: function() {
        this.endpoint = this.$refs.form.getAttribute('action');
        this.form.utmSource = this.$refs.utmSourceInput.value;
        this.form.Language = this.$refs.languageInput.value;
    },
    methods: {
        sendFormData: function() {
            this.status = 150;
   
            var $this = this;

            axios({
                method: 'POST',
                url: this.endpoint,
                data: this.form,
                validateStatus: function() { return true }
            }).then(function(result) {
                $this.status = result.status;
                if(result.data.Status != 'OK') {
                    if(result.data.Message == "EmailAlreadyExists") {
                        $this.status = 101;
                    } else {
                        $this.status = 500;
                    }
                    //console.error(result.data.Message);
                }
            }).catch(function(error) {
                console.error(result);
            });
        },
        
        validateForm: function() {
            this.$refs.form.classList.add('was-validated');
            if (this.$refs.form.checkValidity() !== false) {
            var $this = this;
            setTimeout(() => {
  $this.sendFormData();
}, "500");
    }
 }
}})