fix bug

Former-commit-id: ebf6767a5955610afbac0489d11441b031a1cc2e

src/containers/epubViewer/component.tsx

@@ -5,18 +5,9 @@ import RecordLocation from "../../utils/readUtils/recordLocation";
 import BookmarkModel from "../../model/Bookmark";
 import StyleUtil from "../../utils/readUtils/styleUtil";
 import ImageViewer from "../../components/imageViewer";
-import Lottie from "react-lottie";
-import animationSiri from "../../assets/lotties/siri.json";
 import Chinese from "chinese-s2t";
 import StorageUtil from "../../utils/storageUtil";
-const siriOptions = {
-  loop: true,
-  autoplay: true,
-  animationData: animationSiri,
-  rendererSettings: {
-    preserveAspectRatio: "xMidYMid slice",
-  },
-};
+
 declare var window: any;
 
 class EpubViewer extends React.Component<ViewAreaProps, ViewAreaStates> {
@@ -27,7 +18,6 @@ class EpubViewer extends React.Component<ViewAreaProps, ViewAreaStates> {
       cfiRange: null,
       contents: null,
       rect: null,
-      loading: true,
     };
     this.isFirst = true;
   }
@@ -67,7 +57,6 @@ class EpubViewer extends React.Component<ViewAreaProps, ViewAreaStates> {
       this.isFirst = false;
     });
     this.props.rendition.on("rendered", () => {
-      this.setState({ loading: false });
       let iframe = document.getElementsByTagName("iframe")[0];
       if (!iframe) return;
       let doc = iframe.contentDocument;
@@ -125,11 +114,6 @@ class EpubViewer extends React.Component<ViewAreaProps, ViewAreaStates> {
         <ImageViewer {...imageViewerProps} />
 
         <PopupMenu {...popupMenuProps} />
-        {this.state.loading ? (
-          <div className="spinner">
-            <Lottie options={siriOptions} height={100} width={300} />
-          </div>
-        ) : null}
         <>
           {this.props.isShowBookmark ? <div className="bookmark"></div> : null}
         </>

src/containers/epubViewer/interface.tsx

@@ -18,7 +18,6 @@ export interface ViewAreaProps {
   handleReadingEpub: (epub: object) => void;
 }
 export interface ViewAreaStates {
-  loading: boolean;
   cfiRange: any;
   contents: any;
   // rendition: any;

src/containers/panels/htmlProgressPanel/component.tsx

@@ -2,19 +2,9 @@ import React from "react";
 import "./progressPanel.css";
 import { Trans } from "react-i18next";
 import { ProgressPanelProps, ProgressPanelState } from "./interface";
-import Lottie from "react-lottie";
-import animationSiri from "../../../assets/lotties/siri.json";
 import { Tooltip } from "react-tippy";
 import _ from "underscore";
 
-const siriOptions = {
-  loop: true,
-  autoplay: true,
-  animationData: animationSiri,
-  rendererSettings: {
-    preserveAspectRatio: "xMidYMid slice",
-  },
-};
 class ProgressPanel extends React.Component<
   ProgressPanelProps,
   ProgressPanelState
@@ -101,11 +91,7 @@ class ProgressPanel extends React.Component<
   };
   render() {
     if (!this.props.htmlBook) {
-      return (
-        <div className="progress-panel">
-          <Lottie options={siriOptions} height={100} width={300} />
-        </div>
-      );
+      return <div className="progress-panel">Loading</div>;
     }
 
     return (

src/containers/panels/progressPanel/component.tsx

@@ -3,17 +3,8 @@ import "./progressPanel.css";
 import RecordLocation from "../../../utils/readUtils/recordLocation";
 import { Trans } from "react-i18next";
 import { ProgressPanelProps, ProgressPanelState } from "./interface";
-import Lottie from "react-lottie";
-import animationSiri from "../../../assets/lotties/siri.json";
 import { Tooltip } from "react-tippy";
-const siriOptions = {
-  loop: true,
-  autoplay: true,
-  animationData: animationSiri,
-  rendererSettings: {
-    preserveAspectRatio: "xMidYMid slice",
-  },
-};
+
 class ProgressPanel extends React.Component<
   ProgressPanelProps,
   ProgressPanelState
@@ -35,7 +26,8 @@ class ProgressPanel extends React.Component<
       nextProps.currentEpub.rendition.location &&
       this.props.currentEpub.rendition
     ) {
-      const currentLocation = this.props.currentEpub.rendition.currentLocation();
+      const currentLocation =
+        this.props.currentEpub.rendition.currentLocation();
       if (!currentLocation.start) {
         return;
       }
@@ -120,11 +112,7 @@ class ProgressPanel extends React.Component<
   handleJumpPage = (event: any) => {};
   render() {
     if (!this.props.locations && this.props.currentEpub.rendition) {
-      return (
-        <div className="progress-panel">
-          <Lottie options={siriOptions} height={100} width={300} />
-        </div>
-      );
+      return <div className="progress-panel">Loading</div>;
     }
     return (
       <div className="progress-panel">

src/pages/epubPage/component.tsx

@@ -6,19 +6,9 @@ import Reader from "../../containers/epubReader";
 import { withRouter } from "react-router-dom";
 import _ from "underscore";
 import BookUtil from "../../utils/fileUtils/bookUtil";
-import Lottie from "react-lottie";
 import "../../assets/styles/reset.css";
-import animationSiri from "../../assets/lotties/siri.json";
 import toast, { Toaster } from "react-hot-toast";
 
-const siriOptions = {
-  loop: true,
-  autoplay: true,
-  animationData: animationSiri,
-  rendererSettings: {
-    preserveAspectRatio: "xMidYMid slice",
-  },
-};
 declare var window: any;
 
 class EpubReader extends React.Component<EpubReaderProps, EpubReaderState> {
@@ -59,11 +49,7 @@ class EpubReader extends React.Component<EpubReaderProps, EpubReaderState> {
 
   render() {
     if (!this.props.isReading) {
-      return (
-        <div className="spinner">
-          <Lottie options={siriOptions} height={100} width={300} />
-        </div>
-      );
+      return null;
     }
     return (
       <>