import Vue from 'vue'
import Resource from 'vue-resource'
import store from './store'
import router from './router'
import App from './components/App.vue'

// Google charts
window.google.charts.load('current', {
  'packages': ['corechart', 'line']
})

// install resource, for http requests
Vue.use(Resource)

const app = new Vue({
  router: router,
  store: store,
  el: "#app",
  template: "<App/>",
  components: { App }
})

window.google.charts.setOnLoadCallback(() => {
  app.$store.commit('SET_CHARTSLOADED')
})

function update_10s () {
  app.$store.dispatch('FETCH_WORLDS')
  app.$store.dispatch('FETCH_MATCHES')
}

function update_1m () {
  app.$store.dispatch('FETCH_GLICKO') // does this really need to be here? could be done once maybe.
  app.$store.dispatch('FETCH_PREDICTEDGLICKO')
  app.$store.dispatch('FETCH_LEADERBOARD')
}

update_10s()
update_1m()
app.$store.dispatch('FETCH_OBJECTIVES')
setInterval(update_10s, 10000)
setInterval(update_1m, 60000)

export { app, router, store }

@@ -147,16 +147,77 @@
 App.vue'
+%0Aimport %7B sync %7D from 'vuex-router-sync'%0A%0Async(store, router)
 %0A%0A// Goo
@@ -482,16 +482,224 @@
 p %7D%0A%7D)%0A%0A
+router.beforeEach((to, from, next) =%3E %7B%0A  var tooltips = document.getElementsByClassName(%22is-active%22);%0A  for (var i = 0; i %3C tooltips.length; i++) %7B%0A    tooltips%5Bi%5D.className = %22mdl-tooltip%22%0A  %7D%0A  next()%0A%7D)%0A%0A
 window.g
@@ -810,46 +810,8 @@
 ) %7B%0A
-  app.$store.dispatch('FETCH_WORLDS')%0A
   ap
@@ -1066,16 +1066,113 @@
 RD')%0A%7D%0A%0A
+// Get worlds only once. Shouldn't need to update every 10s.%0Aapp.$store.dispatch('FETCH_WORLDS')%0A
 update_1

Move worlds out of 10s update, only fetch worlds once. Make tooltips disappear when navigating elsewhere. Sync store & router objects.