client

webapp/graphql/updateOnlineStatus.js

@@ -0,0 +1,7 @@
+import gql from 'graphql-tag'
+
+export const updateOnlineStatus = gql`
+  mutation ($status: OnlineStatus!) {
+    updateOnlineStatus(status: $status)
+  }
+`

webapp/nuxt.config.js

@@ -130,6 +130,7 @@ export default {
     { src: '~/plugins/vue-observe-visibility.js', ssr: false },
     { src: '~/plugins/v-mapbox.js', mode: 'client' },
     { src: '~/plugins/vue-advanced-chat.js', mode: 'client' },
+    { src: '~/plugins/onlineStatus.js', mode: 'client' },
   ],
 
   router: {

webapp/plugins/onlineStatus.js

@@ -0,0 +1,30 @@
+import { updateOnlineStatus as updateOnlineStatusMutation } from '~/graphql/updateOnlineStatus.js'
+
+let _app = null
+
+const updateOnlineStatus = async () => {
+  if (!_app.store.getters['auth/isAuthenticated']) {
+    return
+  }
+
+  const status = document.hidden ? 'away' : 'online'
+
+  const client = _app.apolloProvider.defaultClient
+
+  await client.mutate({
+    mutation: updateOnlineStatusMutation,
+    variables: { status },
+  })
+
+  // TODO
+  console.log(`call home as ${status} at ${new Date().toUTCString()}`)
+}
+
+export default ({ app }) => {
+  _app = app
+  if (process.client) {
+    window.addEventListener('visibilitychange', updateOnlineStatus)
+    setInterval(updateOnlineStatus, 30000)
+    updateOnlineStatus()
+  }
+}