diff --git a/client/src/App.vue b/client/src/App.vue index 4c6b7a8..ac34488 100644 --- a/client/src/App.vue +++ b/client/src/App.vue @@ -27,10 +27,17 @@ export default { }, beforeCreate: function(){ + //Puts token into state on page load + let token = localStorage.getItem('loginToken') + let username = localStorage.getItem('username') + // const socket = io({ path:'/socket' }); const socket = this.$io socket.on('connect', () => { + this.$store.commit('setSocketIoSocket', socket.id) + + this.$io.emit('user_connect', token) }) //Detect if user is on a mobile browser and set a flag in store @@ -41,16 +48,20 @@ export default { this.$store.commit('toggleNightMode') } - //Puts token into state on page load - let token = localStorage.getItem('loginToken') - let username = localStorage.getItem('username') - + //Put user data into global store on load if(token){ this.$store.commit('setLoginToken', {token, username}) } }, mounted: function(){ + + //Update totals for entire app on event + this.$io.on('update_counts', () => { + console.log('Got event, update totals') + this.$store.dispatch('fetchAndUpdateUserTotals') + }) + }, computed: { loggedIn () { diff --git a/client/src/components/AnimatedCounterComponent.vue b/client/src/components/AnimatedCounterComponent.vue new file mode 100644 index 0000000..276bd99 --- /dev/null +++ b/client/src/components/AnimatedCounterComponent.vue @@ -0,0 +1,113 @@ + + + + + diff --git a/client/src/components/GlobalSiteMenu.vue b/client/src/components/GlobalSiteMenu.vue index 63c998f..6028eea 100644 --- a/client/src/components/GlobalSiteMenu.vue +++ b/client/src/components/GlobalSiteMenu.vue @@ -21,7 +21,7 @@ .menu-item { color: #fff; - padding: 0.8em 0px 0.8em 10px; + padding: 0.8em 10px 0.8em 10px; display: inline-block; width: 100%; font-size: 1.15em; @@ -154,7 +154,7 @@