feat: 迁移缓存到indexdb,尝试新增kindle简介模式

hectorqin · Apr 13, 2022 · 3c8fa22 · 3c8fa22
1 parent 4c6670c
commit 3c8fa22
Show file tree

Hide file tree

Showing 15 changed files with 340 additions and 161 deletions.
diff --git a/web/package.json b/web/package.json
@@ -13,6 +13,7 @@
     "codejar": "^3.5.0",
     "core-js": "^3.3.2",
     "element-ui": "^2.4.5",
+    "localforage": "^1.10.0",
     "prismjs": "^1.25.0",
     "register-service-worker": "^1.7.1",
     "stylus": "^0.54.7",

diff --git a/web/src/App.vue b/web/src/App.vue
@@ -212,6 +212,7 @@ export default {
   beforeMount() {
     this.setTheme(this.isNight);
     this.setMiniInterfaceClass();
+    this.setPageTypeClass();
     this.eventBus = eventBus;
     eventBus.$on("showEditor", this.showEditorListener);
   },
@@ -227,10 +228,7 @@ export default {
       return this.$store.getters.isNight;
     },
     autoTheme() {
-      return this.$store.state.config.autoTheme;
-    },
-    miniInterface() {
-      return this.$store.state.config.miniInterface;
+      return this.$store.getters.config.autoTheme;
     },
     dialogWidth() {
       return this.$store.state.miniInterface ? "85%" : "450px";
@@ -273,6 +271,9 @@ export default {
             window.customCSSLoad = true;
           });
       }
+    },
+    "$store.state.config.pageType": function() {
+      this.setPageTypeClass();
     }
   },
   methods: {
@@ -311,6 +312,18 @@ export default {
         );
       }
     },
+    setPageTypeClass() {
+      if (this.$store.getters.isKindlePage) {
+        document.body.className =
+          (document.body.className || "").replace("kindle-page", "") +
+          " kindle-page";
+      } else {
+        document.body.className = (document.body.className || "").replace(
+          "kindle-page",
+          ""
+        );
+      }
+    },
     cancel() {
       this.showLogin = false;
       this.loginForm = {
@@ -613,4 +626,8 @@ export default {
   border: none;
   box-shadow: none;
 }
+.kindle-page {
+  -webkit-tap-highlight-color: rbga(255, 255, 255, 0);
+  -webkit-user-select: none;
+}
 </style>
diff --git a/web/src/components/BookShelf.vue b/web/src/components/BookShelf.vue
@@ -58,7 +58,7 @@ export default {
   props: ["visible"],
   computed: {
     theme() {
-      return this.$store.state.config.theme;
+      return this.$store.getters.config.theme;
     },
     popupTheme() {
       return {

diff --git a/web/src/components/BookSource.vue b/web/src/components/BookSource.vue
@@ -82,7 +82,7 @@ export default {
   props: ["visible"],
   computed: {
     theme() {
-      return this.$store.state.config.theme;
+      return this.$store.getters.config.theme;
     },
     popupTheme() {
       return {

diff --git a/web/src/components/Content.vue b/web/src/components/Content.vue
@@ -81,7 +81,7 @@ export default {
       return this.$store.state.showContent;
     },
     fontSize() {
-      return this.$store.state.config.fontSize + "px";
+      return this.$store.getters.config.fontSize + "px";
     },
     autoPlay: {
       get() {
@@ -106,25 +106,25 @@ export default {
     },
     containerStyle() {
       return {
-        fontSize: this.$store.state.config.fontSize + "px",
-        fontWeight: this.$store.state.config.fontWeight || undefined,
+        fontSize: this.$store.getters.config.fontSize + "px",
+        fontWeight: this.$store.getters.config.fontWeight || undefined,
         color:
-          this.$store.state.config.fontColor ||
+          this.$store.getters.config.fontColor ||
           (this.$store.getters.isNight ? "#666" : "#262626"),
         ...this.$store.getters.currentFontFamily,
-        ...(this.$store.state.config.contentCSS || {})
+        ...(this.$store.getters.config.contentCSS || {})
       };
     },
     pStyle() {
       return {
-        lineHeight: this.$store.state.config.lineHeight,
+        lineHeight: this.$store.getters.config.lineHeight,
         marginTop:
-          typeof this.$store.state.config.paragraphSpace !== "undefined"
-            ? this.$store.state.config.paragraphSpace + "em"
+          typeof this.$store.getters.config.paragraphSpace !== "undefined"
+            ? this.$store.getters.config.paragraphSpace + "em"
             : null,
         marginBottom:
-          typeof this.$store.state.config.paragraphSpace !== "undefined"
-            ? this.$store.state.config.paragraphSpace + "em"
+          typeof this.$store.getters.config.paragraphSpace !== "undefined"
+            ? this.$store.getters.config.paragraphSpace + "em"
             : null
       };
     },

diff --git a/web/src/components/Explore.vue b/web/src/components/Explore.vue
@@ -93,7 +93,7 @@ export default {
   props: ["visible", "bookSourceList"],
   computed: {
     theme() {
-      return this.$store.state.config.theme;
+      return this.$store.getters.config.theme;
     },
     popupTheme() {
       return {

diff --git a/web/src/components/PopCatalog.vue b/web/src/components/PopCatalog.vue
@@ -71,7 +71,7 @@ export default {
       }
     },
     theme() {
-      return this.$store.state.config.theme;
+      return this.$store.getters.config.theme;
     },
     popupTheme() {
       return {