input box trans

src/config/i18n.js

@@ -571,6 +571,10 @@ export const I18N = {
     zh: `触发翻译快捷键`,
     en: `Trigger Translation Shortcut Keys`,
   },
+  trigger_trans_shortcut_help: {
+    zh: `不设则默认为单击快捷键“Alt+i”`,
+    en: `If not set, the default is to click the shortcut key "Alt+i"`,
+  },
   shortcut_press_count: {
     zh: `快捷键连击次数`,
     en: `Shortcut Press Nunber`,

src/config/index.js

@@ -199,12 +199,14 @@ export const GLOBLA_RULE = {
   textDiyStyle: "",
 };
 
+// 输入框翻译
+export const DEFAULT_INPUT_SHORTCUT = ["Alt", "i"];
 export const DEFAULT_INPUT_RULE = {
   transOpen: true,
   translator: OPT_TRANS_MICROSOFT,
   fromLang: "auto",
   toLang: "en",
-  triggerShortcut: ["Alt", "i"],
+  triggerShortcut: DEFAULT_INPUT_SHORTCUT,
   triggerCount: 1,
 };
 

src/libs/translator.js

@@ -11,10 +11,11 @@ import {
   OPT_MOUSEKEY_MOUSEOVER,
   DEFAULT_INPUT_RULE,
   DEFAULT_TRANS_APIS,
+  DEFAULT_INPUT_SHORTCUT,
 } from "../config";
 import Content from "../views/Content";
 import { updateFetchPool, clearFetchPool } from "./fetch";
-import { debounce, genEventName } from "./utils";
+import { debounce, genEventName, removeEndchar } from "./utils";
 import { stepShortcutRegister } from "./shortcut";
 import { apiTranslate } from "../apis";
 import { tryDetectLang } from ".";
@@ -257,7 +258,7 @@ export class Translator {
   };
 
   _registerInput = () => {
-    const {
+    let {
       triggerShortcut,
       translator,
       fromLang,
@@ -269,6 +270,11 @@ export class Translator {
       translator
     ];
 
+    if (triggerShortcut.length === 0) {
+      triggerShortcut = DEFAULT_INPUT_SHORTCUT;
+      triggerCount = 1;
+    }
+
     stepShortcutRegister(
       triggerShortcut,
       () => {
@@ -278,12 +284,17 @@ export class Translator {
           let timer;
 
           if (this._inputNodeNames.includes(node.nodeName)) {
-            text = node.value?.trim() || "";
+            text = node.value || "";
           } else {
-            text = node.textContent?.trim() || "";
+            text = node.textContent || "";
           }
 
-          if (!text) {
+          // todo: remove multiple char
+          if (triggerShortcut.length === 1 && triggerShortcut[0].length === 1) {
+            text = removeEndchar(text, triggerShortcut[0], triggerCount);
+          }
+
+          if (!text.trim()) {
             return;
           }
 

src/libs/utils.js

@@ -179,3 +179,18 @@ export const isSameSet = (a, b) => {
   const s = new Set([...a, ...b]);
   return s.size === a.size && s.size === b.size;
 };
+
+/**
+ * 去掉字符串末尾某个字符
+ * @param {*} s
+ * @param {*} c
+ * @param {*} count
+ * @returns
+ */
+export const removeEndchar = (s, c, count = 1) => {
+  let i = s.length;
+  while (i > s.length - count && s[i - 1] === c) {
+    i--;
+  }
+  return s.slice(0, i);
+};

src/views/Options/InputSetting.js

@@ -119,6 +119,7 @@ export default function InputSetting() {
                 value={triggerShortcut}
                 onChange={handleShortcutInput}
                 label={i18n("trigger_trans_shortcut")}
+                helperText={i18n("trigger_trans_shortcut_help")}
               />
             </Grid>
             <Grid item xs={12} sm={12} md={6} lg={6}>

src/views/Options/ShortcutInput.js

@@ -5,7 +5,7 @@ import EditIcon from "@mui/icons-material/Edit";
 import { useEffect, useState, useRef } from "react";
 import { shortcutListener } from "../../libs/shortcut";
 
-export default function ShortcutInput({ value, onChange, label }) {
+export default function ShortcutInput({ value, onChange, label, helperText }) {
   const [disabled, setDisabled] = useState(true);
   const inputRef = useRef(null);
 
@@ -30,7 +30,7 @@ export default function ShortcutInput({ value, onChange, label }) {
   }, [disabled, onChange]);
 
   return (
-    <Stack direction="row">
+    <Stack direction="row" alignItems="flex-start">
       <TextField
         size="small"
         label={label}
@@ -42,6 +42,7 @@ export default function ShortcutInput({ value, onChange, label }) {
         onBlur={() => {
           setDisabled(true);
         }}
+        helperText={helperText}
       />
       <IconButton
         onClick={() => {