add yandex translate

koodo-reader · Dec 31, 2023 · 75f334e · 75f334e
1 parent 8ed91ea
commit 75f334e
Show file tree

Hide file tree

Showing 15 changed files with 329 additions and 73 deletions.
diff --git a/package.json b/package.json
@@ -33,8 +33,10 @@
     "howler": "^2.2.3",
     "iconv-lite": "^0.6.3",
     "onedrive-api": "^1.1.1",
+    "qs": "^6.11.2",
     "react-hot-toast": "^2.1.1",
     "request": "^2.88.2",
+    "uuid": "^9.0.1",
     "webdav": "^3.6.2",
     "webdav-fs": "^3.0.0",
     "wink-lemmatizer": "^3.0.4",

diff --git a/src/assets/styles/fonts/icomoon.eot b/src/assets/styles/fonts/icomoon.eot
diff --git a/src/assets/styles/fonts/icomoon.svg b/src/assets/styles/fonts/icomoon.svg
diff --git a/src/assets/styles/fonts/icomoon.ttf b/src/assets/styles/fonts/icomoon.ttf
diff --git a/src/assets/styles/fonts/icomoon.woff b/src/assets/styles/fonts/icomoon.woff
diff --git a/src/assets/styles/style.css b/src/assets/styles/style.css
@@ -1,10 +1,10 @@
 @font-face {
   font-family: 'icomoon';
-  src:  url('fonts/icomoon.eot?5jeq75');
-  src:  url('fonts/icomoon.eot?5jeq75#iefix') format('embedded-opentype'),
-    url('fonts/icomoon.ttf?5jeq75') format('truetype'),
-    url('fonts/icomoon.woff?5jeq75') format('woff'),
-    url('fonts/icomoon.svg?5jeq75#icomoon') format('svg');
+  src:  url('fonts/icomoon.eot?x2g1mi');
+  src:  url('fonts/icomoon.eot?x2g1mi#iefix') format('embedded-opentype'),
+    url('fonts/icomoon.ttf?x2g1mi') format('truetype'),
+    url('fonts/icomoon.woff?x2g1mi') format('woff'),
+    url('fonts/icomoon.svg?x2g1mi#icomoon') format('svg');
   font-weight: normal;
   font-style: normal;
   font-display: block;
@@ -25,6 +25,9 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-yandex:before {
+  content: "\e953";
+}
 .icon-deepl:before {
   content: "\e952";
 }

diff --git a/src/components/popups/popupDict/component.tsx b/src/components/popups/popupDict/component.tsx
@@ -7,7 +7,6 @@ import Parser from "html-react-parser";
 import * as DOMPurify from "dompurify";
 import axios from "axios";
 import { getBingDict } from "../../../utils/serviceUtils/bingDictUtil";
-import { openExternalUrl } from "../../../utils/serviceUtils/urlUtil";
 import RecordLocation from "../../../utils/readUtils/recordLocation";
 import DictHistory from "../../../model/DictHistory";
 import { Trans } from "react-i18next";
@@ -219,33 +218,7 @@ class PopupDict extends React.Component<PopupDictProps, PopupDictState> {
               DOMPurify.sanitize(this.state.dictText + "<address></address>") ||
                 " ",
               {
-                replace: (domNode) => {
-                  if (this.state.dictService === "Yandex.Dictionary") {
-                    if (domNode.name === "address") {
-                      delete domNode.attribs.onclick;
-                      return (
-                        <p
-                          onClick={() => {
-                            openExternalUrl(
-                              this.state.dictService
-                                ? dictList.filter(
-                                    (item) =>
-                                      item.name === this.state.dictService
-                                  )[0].url
-                                : dictList[0].url
-                            );
-                          }}
-                          className="dict-url"
-                        >
-                          {"Powered by " +
-                            (this.state.dictService
-                              ? this.state.dictService
-                              : "Free Dictionary API")}
-                        </p>
-                      );
-                    }
-                  }
-                },
+                replace: (domNode) => {},
               }
             )}
           </div>

diff --git a/src/components/popups/popupTrans/component.tsx b/src/components/popups/popupTrans/component.tsx
@@ -5,10 +5,12 @@ import {
   googleTransList,
   edgeTransList,
   deeplTransList,
+  yandexTransList,
 } from "../../../constants/translationList";
 import StorageUtil from "../../../utils/serviceUtils/storageUtil";
-import { bingTranlate } from "../../../utils/serviceUtils/bingTransUtil";
-import { deeplTranlate } from "../../../utils/serviceUtils/deeplTransUtil";
+import { bingTranslate } from "../../../utils/serviceUtils/bingTransUtil";
+import { deeplTranslate } from "../../../utils/serviceUtils/deeplTransUtil";
+import { yandexTranslate } from "../../../utils/serviceUtils/yandexTransUtil";
 class PopupTrans extends React.Component<PopupTransProps, PopupTransState> {
   constructor(props: PopupTransProps) {
     super(props);
@@ -27,7 +29,21 @@ class PopupTrans extends React.Component<PopupTransProps, PopupTransState> {
   }
   handleTrans = (text: string) => {
     if (this.state.transService === "Bing") {
-      bingTranlate(
+      bingTranslate(
+        text,
+        StorageUtil.getReaderConfig("transSource") || "",
+        StorageUtil.getReaderConfig("transTarget") || "en"
+      )
+        .then((res) => {
+          this.setState({
+            translatedText: res,
+          });
+        })
+        .catch((err) => {
+          console.log(err);
+        });
+    } else if (this.state.transService === "Yandex") {
+      yandexTranslate(
         text,
         StorageUtil.getReaderConfig("transSource") || "",
         StorageUtil.getReaderConfig("transTarget") || "en"
@@ -41,7 +57,7 @@ class PopupTrans extends React.Component<PopupTransProps, PopupTransState> {
           console.log(err);
         });
     } else if (this.state.transService === "Deepl") {
-      deeplTranlate(
+      deeplTranslate(
         text,
         StorageUtil.getReaderConfig("transSource") || "auto",
         StorageUtil.getReaderConfig("transTarget") || "EN"
@@ -128,6 +144,19 @@ class PopupTrans extends React.Component<PopupTransProps, PopupTransState> {
               <span className="icon-deepl trans-deepl-icon"></span>
               Deepl
             </div>
+            <div
+              className={
+                this.state.transService === "Yandex"
+                  ? "trans-service-selector"
+                  : "trans-service-selector-inactive"
+              }
+              onClick={() => {
+                this.handleChangeService("Yandex");
+              }}
+            >
+              <span className="icon-yandex trans-yandex-icon"></span>
+              Yandex
+            </div>
           </div>
           <div className="trans-lang-selector-container">
             <div className="original-lang-box">
@@ -146,6 +175,8 @@ class PopupTrans extends React.Component<PopupTransProps, PopupTransState> {
                   ? Object.keys(googleTransList)
                   : this.state.transService === "Deepl"
                   ? Object.keys(deeplTransList)
+                  : this.state.transService === "Yandex"
+                  ? Object.keys(yandexTransList)
                   : Object.keys(edgeTransList)
                 ).map((item, index) => {
                   return (
@@ -164,6 +195,8 @@ class PopupTrans extends React.Component<PopupTransProps, PopupTransState> {
                           ? Object.values(googleTransList)
                           : this.state.transService === "Deepl"
                           ? Object.values(deeplTransList)
+                          : this.state.transService === "Yandex"
+                          ? Object.values(yandexTransList)
                           : Object.values(edgeTransList))[index]
                       }
                     </option>
@@ -187,6 +220,8 @@ class PopupTrans extends React.Component<PopupTransProps, PopupTransState> {
                   ? Object.keys(googleTransList)
                   : this.state.transService === "Deepl"
                   ? Object.keys(deeplTransList)
+                  : this.state.transService === "Yandex"
+                  ? Object.keys(yandexTransList)
                   : Object.keys(edgeTransList)
                 ).map((item, index) => {
                   return (
@@ -205,6 +240,8 @@ class PopupTrans extends React.Component<PopupTransProps, PopupTransState> {
                           ? Object.values(googleTransList)
                           : this.state.transService === "Deepl"
                           ? Object.values(deeplTransList)
+                          : this.state.transService === "Yandex"
+                          ? Object.values(yandexTransList)
                           : Object.values(edgeTransList))[index]
                       }
                     </option>

diff --git a/src/components/popups/popupTrans/popupTrans.css b/src/components/popups/popupTrans/popupTrans.css
@@ -101,7 +101,11 @@
   font-size: 14px;
 }
 .trans-deepl-icon {
-  font-size: 14px;
+  font-size: 15px;
+}
+.trans-yandex-icon {
+  font-size: 13px;
+  font-weight: bold;
 }
 .trans-service-selector-inactive {
   border: 1px solid rgba(0, 0, 0, 0.05);
@@ -119,7 +123,7 @@
 .trans-service-selector-container {
   position: absolute;
   top: 20px;
-  width: 270px;
+  width: 360px;
   display: flex;
   justify-content: space-between;
 }

diff --git a/src/constants/dictList.tsx b/src/constants/dictList.tsx
@@ -4,11 +4,15 @@ export const dictList = [
     url: "https://dictionaryapi.dev/",
   },
   {
-    name: "Google Dictionary",
+    name: "Google Dict",
     url: "https://www.google.com",
   },
   {
     name: "必应词典",
     url: "https://www.bing.com/dict",
   },
+  {
+    name: "Cambridge Dict",
+    url: "https://dictionary.cambridge.org",
+  },
 ];