<template>
	<div id="app">

		<global-site-menu />

		<router-view />

	</div>
</template>

<script>

export default {
	components: {
		'global-site-menu': require('@/components/GlobalSiteMenu.vue').default,
	},
	data: function(){ 
		return {
			// loggedIn: 
		}
	},
	beforeCreate: function(){

		//Detect if user is on a mobile browser and set a flag in store
		this.$store.commit('detectIsUserOnMobile')

		//Set color theme based on local storage
		if(localStorage.getItem('nightMode') == 'true'){
			this.$store.commit('toggleNightMode')
		}

		//Puts token into state on page load
		let token = localStorage.getItem('loginToken')
		let username = localStorage.getItem('username')

		if(token){
			this.$store.commit('setLoginToken', {token, username})
		}

	},
	mounted: function(){

	},
	computed: {
		loggedIn () {
			//Map logged in from state
			return this.$store.getters.getLoggedIn
		}
	},
	methods: {
		destroyLoginToken() {
			this.$store.commit('destroyLoginToken')
		},
		loginGateway() {
			if(!this.loggedIn){
				console.log('This user is not logged in')
				this.$router.push({'path':'/login'})
				return
			}
		}
	}
}
</script>