var loginView = new Vue({
	el: '#login-form',
	data: {
		loginApi :'https://prodapi.upgrad.com/apis/v2/login',
		username : '',
		password : ''
	},
	computed: {
		payload: function () {
		  return {
			username: this.username,
			password: this.password
		  }
		}
	},
	created: function () {
		if (this.getAuthToken()) {
			window.open('/frontend/choice.html', '_self')
		}
	},
	mounted: function() {
		this.sessionId = this.generateGUID();
	},
	methods: {
		generateGUID: function() {
			return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
				var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
				return v.toString(16);
			});
		},
		submitForm: function(e){
			e.preventDefault();
			this.authenticate();
		},
		getAuthToken : function () {
			return $.cookie('HTTP_AUTH_TOKEN');
		},
		randomIdGenerator: function(){
			return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g,(c)=>{
				r = Math.random()*16|0
				v =  (c === 'x') ? r : r & 0x3 | 0x8
				return v.toString(16)
			})
		},
		getSessionIdForLogin: function(){
			sessionId = this.randomIdGenerator()
			$.cookie('upgrad-sessionId', sessionId)
			return sessionId
		},
		getUrlVars: function() {
			var vars = [],
				hash;
			var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
			for (var i = 0; i < hashes.length; i++) {
				hash = hashes[i].split('=');
				vars.push(hash[0]);
				vars[hash[0]] = hash[1];
			}
			return vars;
		},

		authenticate:function (event) {
			var handle  = this
			$.ajax({
				url: handle.loginApi ,
				type: 'POST',
				data: JSON.stringify(handle.payload),
				headers: {
					sessionId:this.getSessionIdForLogin()
				},
				contentType: 'application/json',
				success: function (data, status, xhr) {
					$.cookie('HTTP_AUTH_TOKEN', xhr.getResponseHeader('auth-token'), {
						expires: 7
					}, {
						path: '/'
					});
					localStorage.setItem('userEmail', data.email);
					localStorage.setItem('user', data.name);
					var queryParam = handle.getUrlVars()
					if (queryParam.redirect) {
						window.open(queryParam.redirect, '_self')
					} else {
						window.open('/frontend/choice.html', '_self')
					}
				},
				error: function () {
					if (arguments[0].responseJSON) {
						window.alert(arguments[0].responseJSON.errorList[0].errorMessage);
					} else {
						window.alert('Something went wrong!')
					}
				}
			})
		}
	}
})