From dda87410b870f5be2055e60cfe40dab6b373238d Mon Sep 17 00:00:00 2001
From: Simon Bruder <simon@sbruder.de>
Date: Sat, 7 Dec 2019 19:43:15 +0000
Subject: [PATCH] Set title according to current view

---
 frontend/.eslintrc.js             |  3 ++-
 frontend/src/api-client.js        |  2 +-
 frontend/src/router.js            | 32 +++++++++++++++++++++++++------
 frontend/src/views/VolumeList.vue |  2 +-
 4 files changed, 30 insertions(+), 9 deletions(-)

diff --git a/frontend/.eslintrc.js b/frontend/.eslintrc.js
index 98d0431..3638789 100644
--- a/frontend/.eslintrc.js
+++ b/frontend/.eslintrc.js
@@ -9,7 +9,8 @@ module.exports = {
   ],
   rules: {
     'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
-    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
+    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
+    'standard/no-callback-literal': 'off'
   },
   parserOptions: {
     parser: 'babel-eslint'
diff --git a/frontend/src/api-client.js b/frontend/src/api-client.js
index c569a6c..3e69df8 100644
--- a/frontend/src/api-client.js
+++ b/frontend/src/api-client.js
@@ -17,7 +17,7 @@ export default {
     })
   },
 
-  listVolumes (series, callback) {
+  getSeriesInfo (series, callback) {
     apiRequest(`series/${series}`, info => {
       info.volumes = info.volumes.map(volume => {
         volume.thumbnail = `${apiBase}/volume/${volume.id}/cover/thumbnail`
diff --git a/frontend/src/router.js b/frontend/src/router.js
index 4e9aea4..1223260 100644
--- a/frontend/src/router.js
+++ b/frontend/src/router.js
@@ -1,29 +1,49 @@
-import Vue from 'vue'
+import API from '@/api-client.js'
+import Reader from './views/Reader.vue'
 import Router from 'vue-router'
 import SeriesList from './views/SeriesList.vue'
 import VolumeList from './views/VolumeList.vue'
-import Reader from './views/Reader.vue'
+import Vue from 'vue'
 
 Vue.use(Router)
 
-export default new Router({
+const router = new Router({
   mode: 'history',
   base: process.env.BASE_URL,
   routes: [
     {
       path: '/',
       name: 'series-list',
-      component: SeriesList
+      component: SeriesList,
+      meta: {
+        title: (to, callback) => callback('Home')
+      }
     },
     {
       path: '/series/:id',
       name: 'volume-list',
-      component: VolumeList
+      component: VolumeList,
+      meta: {
+        title: (to, callback) => API.getSeriesInfo(to.params.id, info => callback(info.title))
+      }
     },
     {
       path: '/volume/:id',
       name: 'reader',
-      component: Reader
+      component: Reader,
+      meta: {
+        title: (to, callback) => API.getVolumeInfo(to.params.id, info => callback(info.title))
+      }
     }
   ]
 })
+
+// https://github.com/vuejs/vue-router/issues/914#issuecomment-261461921
+router.beforeEach((to, from, next) => {
+  to.meta.title(to, (title) => {
+    document.title = `${title} – Manga Reader`
+  })
+  next()
+})
+
+export default router
diff --git a/frontend/src/views/VolumeList.vue b/frontend/src/views/VolumeList.vue
index 9056272..3b02853 100644
--- a/frontend/src/views/VolumeList.vue
+++ b/frontend/src/views/VolumeList.vue
@@ -25,7 +25,7 @@ export default {
     }
   },
   mounted () {
-    API.listVolumes(this.$route.params.id, info => (this.info = info))
+    API.getSeriesInfo(this.$route.params.id, info => (this.info = info))
   }
 }
 </script>