[pull] master from troyeguo:master

main.js

@@ -149,11 +149,16 @@ const createMainWin = () => {
     mainWin.webContents.openDevTools();
     event.returnvalue = true;
   });
-  ipcMain.handle("reload", (event, arg) => {
+  ipcMain.handle("reload-reader", (event, arg) => {
     if (readerWindow) {
       readerWindow.reload();
     }
   });
+  ipcMain.handle("reload-main", (event, arg) => {
+    if (mainWin) {
+      mainWin.reload();
+    }
+  });
   ipcMain.handle("focus-on-main", (event, arg) => {
     if (mainWin) {
       if (!mainWin.isVisible()) mainWin.show();

src/assets/locales/cn/translation.json

@@ -95,6 +95,7 @@
   "Export All Notes": "导出所有笔记",
   "Export All Highlights": "导出所有高亮",
   "Export All": "导出全部",
+  "Hide floating button in PDF reader": "隐藏PDF阅读器中的悬浮按钮",
   "Export Books": "导出图书",
   "Export Notes": "导出笔记",
   "Export Highlights": "导出高亮",

src/assets/locales/en/translation.json

@@ -114,6 +114,7 @@
   "Nothing to export": "Nothing to export",
   "Take effect in a while": "Take effect in a while",
   "Follow OS": "Follow OS",
+  "Hide floating button in PDF reader": "Hide floating button in PDF reader",
   "Use first page as PDF cover": "Use first page as PDF cover",
   "You may see this error when the book you're importing is not supported by Koodo Reader, try converting it with Calibre": "You may see this error when the book you're importing is not supported by Koodo Reader, try converting it with Calibre",
   "Simplified To Traditional": "Simplified To Traditional",
@@ -327,7 +328,7 @@
   "Close main window while reading": "Close main window while reading",
   "Merge reader into Word": "Merge reader into Word",
   "Get rid of window frame, make reader hide into Word or any text editor, and can't be detected. You need to set up the reader's position, size and style first.": "Get rid of window frame, make reader hide into Word or any text editor, and can't be detected. You need to set up the reader's position, size and style first.",
-  "The imported books will not be copied to library, only linked to the original book path": "The imported books will not be copied to library, only linked to the original book path",
+  "The imported books will not be copied to library, only linked to the original book path": "The imported books will not be copied to the library, only linked to the original book path",
   "Reader menu will not be triggered by hovering but clicking on the area": "Reader menu will not be triggered by hovering but clicking on the area",
   "Gesture and UI optimization for touch screen": "Gesture and UI optimization for touch screen",
   "The book that you read from last time will be open automatically when launching": "The book that you read from last time will be open automatically when launching",

src/components/backToMain/index.tsx

@@ -38,9 +38,12 @@ const BackToMain = (props: any) => {
         }
       }}
       style={
-        StorageUtil.getReaderConfig("isHideHome") === "yes" && 
-        document.URL.indexOf("pdf") > -1 ? { display: "none" } : 
-        document.URL.indexOf("djvu") > -1 ? { bottom: "60px" } : {}
+        StorageUtil.getReaderConfig("isHideFloating") === "yes" &&
+        document.URL.indexOf("pdf") > -1
+          ? { display: "none" }
+          : document.URL.indexOf("djvu") > -1
+          ? { bottom: "60px" }
+          : {}
       }
     >
       <span className="icon-home back-home"></span>

src/components/dialogs/aboutDialog/aboutDialog.css

@@ -1,9 +1,5 @@
 .icon-export-all {
-  margin-left: 5px;
   line-height: 18px;
   display: inline-block;
-  position: relative;
-  top: 2px;
-  left: 5px;
   transform: rotate(-90deg) scale(0.7);
 }

src/components/dialogs/aboutDialog/component.tsx

@@ -10,6 +10,7 @@ import {
   exportNotes,
 } from "../../../utils/syncUtils/exportUtil";
 import "./aboutDialog.css";
+import StorageUtil from "../../../utils/serviceUtils/storageUtil";
 
 class AboutDialog extends React.Component<AboutDialogProps, AboutDialogState> {
   constructor(props: AboutDialogProps) {
@@ -34,15 +35,7 @@ class AboutDialog extends React.Component<AboutDialogProps, AboutDialogState> {
           onMouseEnter={() => {
             this.props.handleAbout(true);
           }}
-          style={
-            this.props.isNewWarning
-              ? { left: "510px", width: "150px" }
-              : {
-                  left: "510px",
-
-                  width: "150px",
-                }
-          }
+          style={{ left: "495px" }}
         >
           <ul className="sort-by-category">
             <li
@@ -58,7 +51,10 @@ class AboutDialog extends React.Component<AboutDialogProps, AboutDialogState> {
             <li
               className="sort-by-category-list"
               onClick={() => {
-                if (navigator.language.indexOf("zh") > -1) {
+                if (
+                  StorageUtil.getReaderConfig("lang") === "zh" ||
+                  StorageUtil.getReaderConfig("lang") === "cht"
+                ) {
                   this.handleJump(
                     "https://troyeguo.notion.site/Koodo-Reader-0c9c7ccdc5104a54825dfc72f1c84bea"
                   );
@@ -82,7 +78,10 @@ class AboutDialog extends React.Component<AboutDialogProps, AboutDialogState> {
             <li
               className="sort-by-category-list"
               onClick={() => {
-                if (navigator.language.indexOf("zh") > -1) {
+                if (
+                  StorageUtil.getReaderConfig("lang") === "zh" ||
+                  StorageUtil.getReaderConfig("lang") === "cht"
+                ) {
                   this.handleJump(
                     "https://www.notion.so/troyeguo/215baeda57804fd29dbb0e91d1e6a021?v=360c00183d944b598668f34c255edfd7"
                   );
@@ -121,18 +120,6 @@ class AboutDialog extends React.Component<AboutDialogProps, AboutDialogState> {
             >
               <Trans>Github Repo</Trans>
             </li>
-            <li
-              className="sort-by-category-list"
-              onMouseEnter={() => {
-                this.setState({ isShowExportAll: true });
-              }}
-              onMouseLeave={(event) => {
-                event.stopPropagation();
-              }}
-            >
-              <Trans>Export All</Trans>
-              <span className="icon-dropdown icon-export-all"></span>
-            </li>
 
             {isElectron && (
               <li
@@ -157,6 +144,19 @@ class AboutDialog extends React.Component<AboutDialogProps, AboutDialogState> {
                 <Trans>New Version</Trans>
               </li>
             )}
+            <li
+              className="sort-by-category-list"
+              onMouseEnter={() => {
+                this.setState({ isShowExportAll: true });
+              }}
+              onMouseLeave={(event) => {
+                this.setState({ isShowExportAll: false });
+                event.stopPropagation();
+              }}
+            >
+              <Trans>Export All</Trans>
+              <span className="icon-dropdown icon-export-all"></span>
+            </li>
           </ul>
         </div>
         <div
@@ -165,11 +165,15 @@ class AboutDialog extends React.Component<AboutDialogProps, AboutDialogState> {
             this.state.isShowExportAll
               ? {
                   position: "absolute",
-                  left: "662px",
+                  left: "675px",
                   top: "250px",
                 }
               : { display: "none" }
           }
+          onMouseEnter={(event) => {
+            this.setState({ isShowExportAll: true });
+            event?.stopPropagation();
+          }}
           onMouseLeave={() => {
             this.setState({ isShowExportAll: false });
             this.props.handleAbout(false);

src/components/dialogs/actionDialog/actionDialog.css

@@ -28,6 +28,9 @@
   display: flex;
   align-items: center;
   padding: 4px 15px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 
 .action-name {

src/components/dialogs/actionDialog/component.tsx

@@ -72,7 +72,6 @@ class ActionDialog extends React.Component<
               <span className="action-name">
                 <Trans>Restore</Trans>
               </span>
-              <p className="action-name"></p>
             </div>
           </div>
         </div>
@@ -101,7 +100,6 @@ class ActionDialog extends React.Component<
               <p className="action-name">
                 <Trans>Add to Shelf</Trans>
               </p>
-              <p className="action-name"></p>
             </div>
             <div
               className="action-dialog-delete"
@@ -113,7 +111,6 @@ class ActionDialog extends React.Component<
               <p className="action-name">
                 <Trans>Delete</Trans>
               </p>
-              <p className="action-name"></p>
             </div>
             <div
               className="action-dialog-edit"
@@ -125,27 +122,30 @@ class ActionDialog extends React.Component<
               <p className="action-name">
                 <Trans>Edit</Trans>
               </p>
-              <p className="action-name"></p>
             </div>
             <div
               className="action-dialog-edit"
               onMouseEnter={() => {
                 this.setState({ isShowExport: true });
               }}
               onMouseLeave={(event) => {
-                // this.setState({ isShowExport: false });
+                this.setState({ isShowExport: false });
                 event.stopPropagation();
               }}
+              style={{ display: "flex", justifyContent: "space-between" }}
             >
-              <span className="icon-export view-icon"></span>
-              <p className="action-name">
-                <Trans>Export</Trans>
+              <p className="action-name" style={{ marginLeft: "0px" }}>
                 <span
-                  className="icon-dropdown icon-export-all"
-                  style={{ left: "95px" }}
+                  className="icon-export view-icon"
+                  style={{ marginRight: "15px" }}
                 ></span>
+                <Trans>Export</Trans>
               </p>
-              <p className="action-name"></p>
+
+              <span
+                className="icon-dropdown icon-export-all"
+                style={{ left: "95px" }}
+              ></span>
             </div>
 
             <div className="sort-dialog-seperator"></div>
@@ -232,11 +232,16 @@ class ActionDialog extends React.Component<
             this.setState({ isShowExport: false });
             this.props.handleActionDialog(false);
           }}
+          onMouseEnter={(event) => {
+            this.setState({ isShowExport: true });
+            this.props.handleActionDialog(true);
+            event?.stopPropagation();
+          }}
           style={
             this.state.isShowExport
               ? {
                   position: "absolute",
-                  left: this.props.left + 5,
+                  left: this.props.left,
                   top: this.props.top + 70,
                 }
               : { display: "none" }
@@ -263,7 +268,6 @@ class ActionDialog extends React.Component<
             <p className="action-name">
               <Trans>Export Books</Trans>
             </p>
-            <p className="action-name"></p>
           </div>
           <div
             className="action-dialog-edit"
@@ -291,7 +295,6 @@ class ActionDialog extends React.Component<
             <p className="action-name">
               <Trans>Export Notes</Trans>
             </p>
-            <p className="action-name"></p>
           </div>
           <div
             className="action-dialog-edit"
@@ -319,7 +322,6 @@ class ActionDialog extends React.Component<
             <p className="action-name">
               <Trans>Export Highlights</Trans>
             </p>
-            <p className="action-name"></p>
           </div>
         </div>
       </>

src/components/dialogs/backupDialog/component.tsx

@@ -263,7 +263,7 @@ class BackupDialog extends React.Component<
               }}
             >
               <span className="icon-backup"></span>
-              <div style={{ lineHeight: 1.25 }}>
+              <div style={{ lineHeight: 1.0 }}>
                 <Trans>Backup</Trans>
               </div>
             </div>

src/components/dialogs/settingDialog/component.tsx

@@ -48,7 +48,7 @@ class SettingDialog extends React.Component<
       appSkin: StorageUtil.getReaderConfig("appSkin"),
       isUseBuiltIn: StorageUtil.getReaderConfig("isUseBuiltIn") === "yes",
       isPDFCover: StorageUtil.getReaderConfig("isPDFCover") === "yes",
-      isHideHome: StorageUtil.getReaderConfig("isHideHome") === "yes",
+      isHideFloating: StorageUtil.getReaderConfig("isHideFloating") === "yes",
       currentThemeIndex: window._.findLastIndex(themeList, {
         name: StorageUtil.getReaderConfig("themeColor"),
       }),
@@ -75,10 +75,7 @@ class SettingDialog extends React.Component<
       ?.children[
         langList
           .map((item) => item.value)
-          .indexOf(
-            StorageUtil.getReaderConfig("lang") ||
-              (navigator.language.indexOf("zh") > -1 ? "zh" : "en")
-          )
+          .indexOf(StorageUtil.getReaderConfig("lang") || "en")
       ]?.setAttribute("selected", "selected");
     document.getElementsByClassName("lang-setting-dropdown")[2]?.children[
       window._.findLastIndex(searchList, {
@@ -123,7 +120,7 @@ class SettingDialog extends React.Component<
     }
 
     if (isElectron) {
-      toast(this.props.t("Try refresh or restart"));
+      window.require("electron").ipcRenderer.invoke("reload-main", "ping");
     } else {
       window.location.reload();
     }
@@ -206,7 +203,7 @@ class SettingDialog extends React.Component<
     this.setState({ currentThemeIndex: index });
     StorageUtil.setReaderConfig("themeColor", name);
     if (isElectron) {
-      toast(this.props.t("Try refresh or restart"));
+      window.require("electron").ipcRenderer.invoke("reload-main", "ping");
     } else {
       window.location.reload();
     }

src/components/dialogs/settingDialog/interface.tsx

@@ -28,7 +28,7 @@ export interface SettingInfoState {
   isDisableUpdate: boolean;
   isUseBuiltIn: boolean;
   isPDFCover: boolean;
-  isHideHome: boolean;
+  isHideFloating: boolean;
   isAutoFullscreen: boolean;
   isHideShelfBook: boolean;
   isPreventAdd: boolean;

src/components/imageViewer/component.tsx

@@ -35,10 +35,10 @@ class ImageViewer extends React.Component<ImageViewerProps, ImageViewerStates> {
     }
     await handleLinkJump(event, this.props.rendition);
     if (
-      !event.target.src ||
-      event.target.href ||
-      event.target.parentNode.href ||
-      event.target.parentNode.parentNode.href
+      !event.target.getAttribute("src") ||
+      event.target.getAttribute("href") ||
+      event.target.parentNode.getAttribute("href") ||
+      event.target.parentNode.parentNode.getAttribute("href")
     ) {
       return;
     }

src/components/noteTag/component.tsx

@@ -135,15 +135,20 @@ class NoteTag extends React.Component<NoteTagProps, NoteTagState> {
         {this.props.isReading || this.props.isCard ? null : (
           <div className="tag-title">
             <Trans>All Tags</Trans>
-            <span
-              className="icon-dropdown tag-dropdown-icon"
-              onClick={() => {
-                this.handleShowTags(!this.state.isShowTags);
-              }}
+            <div
+              className="note-tag-show-icon"
               style={
-                !this.state.isShowTags ? {} : { transform: "rotate(-90deg)" }
+                !this.state.isShowTags ? { transform: "rotate(-90deg)" } : {}
               }
-            ></span>
+            >
+              <span
+                className="icon-dropdown tag-dropdown-icon"
+                onClick={() => {
+                  this.handleShowTags(!this.state.isShowTags);
+                }}
+                style={{ float: "unset", margin: "0px" }}
+              ></span>
+            </div>
           </div>
         )}