import Vue from 'vue';
import Vuex from 'vuex';
import VueResource from 'vue-resource';
import router from '../router/index'
Vue.use(Vuex);

const LOGIN = "LOGIN";
const LOGIN_SUCCESS = "LOGIN_SUCCESS";
const LOGOUT = "LOGOUT";
const LOADING = "LOADING";
const LOADED = "LOADED";

export const store = new Vuex.Store({
  state: {
    isLoggedIn: !!localStorage.getItem("token"),
    loading: false
  },
  mutations: {
    [LOADING] (state) {
      state.loading = true;
    },
    [LOADED] (state) {
      state.loading = false;
    },
    [LOGIN] (state) {
      state.loading = true;
    },
    [LOGIN_SUCCESS] (state) {
      state.isLoggedIn = true;
      state.loading = false;
    },
    [LOGOUT](state) {
      state.isLoggedIn = false;
    }
  },
  actions: {
    login({ commit }, creds) {
        commit(LOGIN); // show spinner
        Vue.http.post('http://localhost:58181/token', `grant_type=password&username=${creds.email}&password=${creds.password}`,{
            headers: {
                'Content-Type': 'multipart/form-data',
            }
         })
        .then((response) => response.json())
        .then((result) => {
            localStorage.setItem('token', result.access_token);
            commit(LOGIN_SUCCESS);
            router.push({path: '/'});
      })
      .catch(error => alert("Login error"));
    },
    logout({ commit }) {
      localStorage.removeItem("token");
      router.push({path: '/login'});
      commit(LOGOUT);
    }
  },
  getters: {
    isLoggedIn: state => {
      return state.isLoggedIn
     },
     loading: state => {
        return state.loading
       }
  }
});