From dc0cc1380793bf870e11444debf1872a6cefc95c Mon Sep 17 00:00:00 2001
From: Gauthier Roebroeck <gauthier.roebroeck@gmail.com>
Date: Mon, 26 Apr 2021 16:48:57 +0800
Subject: [PATCH] feat(webui): ability to read incognito

---
 komga-webui/src/locales/en.json      |  3 ++-
 komga-webui/src/views/BookReader.vue | 19 ++++++++++++++++---
 komga-webui/src/views/BrowseBook.vue | 24 ++++++++++++++++++++++++
 3 files changed, 42 insertions(+), 4 deletions(-)

diff --git a/komga-webui/src/locales/en.json b/komga-webui/src/locales/en.json
index 6d6b2f970..853695b3c 100644
--- a/komga-webui/src/locales/en.json
+++ b/komga-webui/src/locales/en.json
@@ -95,7 +95,8 @@
       "show_hide_toolbars": "Show/hide toolbars",
       "vertical": "Vertical",
       "webtoon": "Webtoon"
-    }
+    },
+    "tooltip_incognito": "Read progress will not be saved"
   },
   "browse_book": {
     "comment": "COMMENT",
diff --git a/komga-webui/src/views/BookReader.vue b/komga-webui/src/views/BookReader.vue
index 1a3dbd5a8..95023cbad 100644
--- a/komga-webui/src/views/BookReader.vue
+++ b/komga-webui/src/views/BookReader.vue
@@ -20,6 +20,13 @@
           <v-toolbar-title> {{ bookTitle }}</v-toolbar-title>
           <v-spacer></v-spacer>
 
+          <v-tooltip bottom v-if="incognito">
+            <template v-slot:activator="{ on }">
+              <v-icon v-on="on">mdi-incognito</v-icon>
+            </template>
+            <span>{{ $t('bookreader.tooltip_incognito') }}</span>
+          </v-tooltip>
+
           <v-btn
             icon
             @click="showHelp = !showHelp">
@@ -324,6 +331,7 @@ export default Vue.extend({
       series: {} as SeriesDto,
       context: {} as Context,
       contextName: '',
+      incognito: false,
       siblingPrevious: {} as BookDto,
       siblingNext: {} as BookDto,
       jumpToNextBook: false,
@@ -587,6 +595,9 @@ export default Vue.extend({
         document.title = `Komga - ${getBookTitleCompact(this.book.metadata.title, this.series.metadata.title)}`
       }
 
+      // parse query params to get incognito mode
+      this.incognito = !!(this.$route.query.incognito && this.$route.query.incognito.toString().toLowerCase() === 'true');
+
       const pageDtos = (await this.$komgaBooks.getBookPages(bookId))
       pageDtos.forEach((p: any) => p['url'] = this.getPageUrl(p))
       this.pages = pageDtos as PageDtoWithUrl[]
@@ -654,7 +665,7 @@ export default Vue.extend({
         this.$router.push({
           name: 'read-book',
           params: {bookId: this.siblingPrevious.id.toString()},
-          query: {context: this.context.origin, contextId: this.context.id},
+          query: {context: this.context.origin, contextId: this.context.id, incognito: this.incognito.toString()},
         })
       }
     },
@@ -666,7 +677,7 @@ export default Vue.extend({
         this.$router.push({
           name: 'read-book',
           params: {bookId: this.siblingNext.id.toString()},
-          query: {context: this.context.origin, contextId: this.context.id},
+          query: {context: this.context.origin, contextId: this.context.id, incognito: this.incognito.toString()},
         })
       }
     },
@@ -688,6 +699,7 @@ export default Vue.extend({
           page: this.page.toString(),
           context: this.context.origin,
           contextId: this.context.id,
+          incognito: this.incognito.toString(),
         },
       } as Location)
     },
@@ -771,7 +783,8 @@ export default Vue.extend({
       this.notification.enabled = true
     },
     async markProgress(page: number) {
-      await this.$komgaBooks.updateReadProgress(this.bookId, {page: page})
+      if (!this.incognito)
+        await this.$komgaBooks.updateReadProgress(this.bookId, {page: page})
     },
     downloadCurrentPage() {
       new jsFileDownloader({
diff --git a/komga-webui/src/views/BrowseBook.vue b/komga-webui/src/views/BrowseBook.vue
index 75b68bf1d..d6f0a4ab9 100644
--- a/komga-webui/src/views/BrowseBook.vue
+++ b/komga-webui/src/views/BrowseBook.vue
@@ -122,6 +122,18 @@
                   {{ $t('common.read') }}
                 </v-btn>
               </v-col>
+
+              <v-col cols="auto">
+                <v-btn small
+                       :title="$t('browse_book.read_book')"
+                       :to="{name: 'read-book', params: { bookId: bookId}, query: { context: context.origin, contextId: context.id, incognito: true}}"
+                       :disabled="book.media.status !== 'READY' || !canReadPages"
+                >
+                  <v-icon left small>mdi-incognito</v-icon>
+                  {{ $t('common.read') }}
+                </v-btn>
+              </v-col>
+
               <v-col cols="auto">
                 <v-btn :title="$t('browse_book.download_file')"
                        small
@@ -155,6 +167,18 @@
               {{ $t('common.read') }}
             </v-btn>
           </v-col>
+
+          <v-col cols="auto">
+            <v-btn small
+                   :title="$t('browse_book.read_book')"
+                   :to="{name: 'read-book', params: { bookId: bookId}, query: { context: context.origin, contextId: context.id, incognito: true}}"
+                   :disabled="book.media.status !== 'READY' || !canReadPages"
+            >
+              <v-icon left small>mdi-incognito</v-icon>
+              {{ $t('common.read') }}
+            </v-btn>
+          </v-col>
+
           <v-col cols="auto">
             <v-btn :title="$t('browse_book.download_file')"
                    small