var Authenticator = function (selector, token, spid, redirectUrl) {
    var auth = new Vue({
        el: selector,
        data: {
            token: token,
            enterPhoneNumber: true,
            enterCode: false,
            phoneNumber: '',
            loginVipps: '',
            code: '',
            startPageId: spid,
            errorCode: 0,
            returnUrl: redirectUrl,
            reponseTypes: {
                OK: 0,
                UnkownError: 1,
                PhoneNumberEmpty: 2,
                SMSFailed: 3,
                UserNotFound: 4,
                MultipleUsersFound: 5,
                SessionMissing: 6,
                FormDataMissing: 7,
                SecurityCodeMissmatch: 8,
                ToManyFailedAttempts: 9,
                SecurityCodeExpired: 10
            }
        },
        methods: {
            post: function (action, callback, errorCallback) {
                var model = {
                    SiteId: this.startPageId,
                    PhoneNumber: this.phoneNumber,
                    SecurityCode: this.code,
                    //__RequestVerificationToken: this.token
                };

                this.$http.post('/umbraco/surface/Authentication/' + action,
                    model,
                    { emulateJSON: true }
                ).then(function (success) {
                    if (typeof callback === "function") {
                        callback(success.body);
                    }
                }, function (error) {
                    this.errorCode = 1;
                }).finally(function () {

                });
            },
            sendCodeOnSms: function (e) {
                e.preventDefault();

                this.post('PostPhoneNumber', function (responseCode) {
                    this.errorCode = responseCode;

                    if (responseCode === this.reponseTypes.OK) {
                        this.enterPhoneNumber = false;
                        this.enterCode = true;
                    } 

                }.bind(this));
            },
            resendSms: function(e) {
                e.preventDefault();
                this.post('ResendSms', function (responseCode) {
                    this.errorCode = responseCode;
                }.bind(this));
            },
            resetForm: function (e) {
                e.preventDefault();
                location.reload();
            },
            verifyCode: function (e) {
                e.preventDefault();
                this.post('VerifyCode', function (responseCode) {
                    this.errorCode = responseCode;

                    if (responseCode === this.reponseTypes.OK) {
                        window.location.href = this.returnUrl;
                    }

                }.bind(this));
            }
        },
        created: function () {

        }
    });

}

var VippsAuth = function (selector, token, spid, redirectUrl) {
    var auth = new Vue({
        el: selector,
        data: {
            modelVipps: '',
            token: token,
            enterPhoneNumber: true,
            enterCode: false,
            phoneNumber: '',
            loginVipps: '',
            code: '',
            startPageId: spid,
            errorCode: 0,
            returnUrl: redirectUrl,
            reponseTypes2: {
                OK: 0,
                UnkownError: 1,
                PhoneNumberEmpty: 2,
                SMSFailed: 3,
                UserNotFound: 4,
                MultipleUsersFound: 5,
                SessionMissing: 6,
                FormDataMissing: 7,
                SecurityCodeMissmatch: 8,
                ToManyFailedAttempts: 9,
                SecurityCodeExpired: 10
            }
        },
        methods: {
            post: function (action, callback, errorCallback) {
                var model = {
                    SiteId: this.startPageId
                };

                this.$http.post('/umbraco/surface/Authentication/' + action,
                    model,
                    { emulateJSON: true }
                ).then(function (success) {
                    if (typeof callback === "function") {
                        callback(success.body);
                    }
                }, function (error) {
                    this.errorCode = 1;
                }).finally(function () {

                });
            },
            initVipps: function (e) {
                e.preventDefault();

                this.post('PostVippsAuth', function (response) {
                    if (response.Code === 0) {
                        window.location.href = response.redirectUrl;
                    }
                });
            }
        },
        beforeMount: function () {
            this.errorCode = this.$el.getAttribute('data-error-code');
        }
    });
}