Compare commits
20 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
beca31f55d | ||
|
|
c7df103950 | ||
|
|
4bf7972ad5 | ||
|
|
534eaed1ed | ||
|
|
7e014e7385 | ||
|
|
34adb2660b | ||
|
|
b6bc165cf0 | ||
|
|
bdd5ed7fc7 | ||
|
|
95d19417c3 | ||
|
|
30ebebdd71 | ||
|
|
e9c557776d | ||
|
|
535a43b698 | ||
|
|
59752ed4aa | ||
|
|
b3e7b8f3f1 | ||
|
|
c4e9365512 | ||
|
|
7d3972d3a8 | ||
|
|
52ca4306fd | ||
|
|
da368ee612 | ||
|
|
22c50e7765 | ||
|
|
7bc39dd1bc |
2
.env
2
.env
@@ -2,7 +2,7 @@ GENERATE_SOURCEMAP=false
|
||||
|
||||
REACT_APP_NAME=KISS Translator
|
||||
REACT_APP_NAME_CN=简约翻译
|
||||
REACT_APP_VERSION=1.7.13
|
||||
REACT_APP_VERSION=1.7.15
|
||||
|
||||
REACT_APP_HOMEPAGE=https://github.com/fishjar/kiss-translator
|
||||
|
||||
|
||||
@@ -12,7 +12,7 @@ A simple, open source [bilingual translation extension & Greasemonkey script](ht
|
||||
- [x] Chrome/Edge/Firefox/Kiwi
|
||||
- [ ] Safari
|
||||
- [x] Supports multiple translation services
|
||||
- [x] Google/Microsoft/DeepL/OpenAI/CloudflareAI/Baidu/Tencent
|
||||
- [x] Google/Microsoft/DeepL/OpenAI/Gemini/CloudflareAI/Baidu/Tencent
|
||||
- [x] Custom translation interface
|
||||
- [x] Covers common translation scenarios
|
||||
- [x] Web bilingual translation
|
||||
@@ -31,10 +31,9 @@ A simple, open source [bilingual translation extension & Greasemonkey script](ht
|
||||
- `Alt+Q` Toggle Translation
|
||||
- `Alt+C` Toggle Styles
|
||||
- `Alt+K` Open Setting Popup
|
||||
- `Alt+B` Open Translate Popup
|
||||
- `Alt+S` Open Translate Popup / Translate Selected Text
|
||||
- `Alt+O` Open Options Page
|
||||
- `Alt+I` Input Box Translation
|
||||
- `Alt+S` Translate Selected Text
|
||||
|
||||
## Install
|
||||
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
- [x] Chrome/Edge/Firefox/Kiwi
|
||||
- [ ] Safari
|
||||
- [x] 支持多种翻译服务
|
||||
- [x] Google/Microsoft/DeepL/OpenAI/CloudflareAI/Baidu/Tencent
|
||||
- [x] Google/Microsoft/DeepL/OpenAI/Gemini/CloudflareAI/Baidu/Tencent
|
||||
- [x] 自定义翻译接口
|
||||
- [x] 覆盖常见翻译场景
|
||||
- [x] 网页双语对照翻译
|
||||
@@ -31,10 +31,9 @@
|
||||
- `Alt+Q` 开启翻译
|
||||
- `Alt+C` 切换样式
|
||||
- `Alt+K` 打开设置弹窗
|
||||
- `Alt+B` 打开翻译弹窗
|
||||
- `Alt+S` 打开翻译弹窗/翻译选中文字
|
||||
- `Alt+O` 打开设置页面
|
||||
- `Alt+I` 输入框翻译
|
||||
- `Alt+S` 翻译选中文字
|
||||
|
||||
## 安装
|
||||
|
||||
|
||||
@@ -85,6 +85,7 @@ const userscriptWebpack = (config, env) => {
|
||||
// @updateURL ${process.env.REACT_APP_USERSCRIPT_DOWNLOADURL}
|
||||
// @grant GM.xmlHttpRequest
|
||||
// @grant GM.registerMenuCommand
|
||||
// @grant GM.unregisterMenuCommand
|
||||
// @grant GM.setValue
|
||||
// @grant GM.getValue
|
||||
// @grant GM.deleteValue
|
||||
@@ -97,6 +98,7 @@ const userscriptWebpack = (config, env) => {
|
||||
// @connect api.deepl.com
|
||||
// @connect www2.deepl.com
|
||||
// @connect api.openai.com
|
||||
// @connect generativelanguage.googleapis.com
|
||||
// @connect openai.azure.com
|
||||
// @connect workers.dev
|
||||
// @connect github.io
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "kiss-translator",
|
||||
"description": "A minimalist bilingual translation Extension & Greasemonkey Script",
|
||||
"version": "1.7.13",
|
||||
"version": "1.7.15",
|
||||
"author": "Gabe<yugang2002@gmail.com>",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
|
||||
@@ -15,9 +15,6 @@
|
||||
"message": "Open Options (Alt+O)"
|
||||
},
|
||||
"open_tranbox": {
|
||||
"message": "Open Translate Popup (Alt+B)"
|
||||
},
|
||||
"translate_selected": {
|
||||
"message": "Translate Selected Text (Alt+S)"
|
||||
"message": "Translate Popup/Selected (Alt+S)"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -15,9 +15,6 @@
|
||||
"message": "打开设置 (Alt+O)"
|
||||
},
|
||||
"open_tranbox": {
|
||||
"message": "打开翻译弹窗 (Alt+B)"
|
||||
},
|
||||
"translate_selected": {
|
||||
"message": "翻译选中文字 (Alt+S)"
|
||||
"message": "翻译弹窗/选中文字 (Alt+S)"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
"manifest_version": 2,
|
||||
"name": "__MSG_app_name__",
|
||||
"description": "__MSG_app_description__",
|
||||
"version": "1.7.13",
|
||||
"version": "1.7.15",
|
||||
"default_locale": "en",
|
||||
"author": "Gabe<yugang2002@gmail.com>",
|
||||
"homepage_url": "https://github.com/fishjar/kiss-translator",
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
"manifest_version": 3,
|
||||
"name": "__MSG_app_name__",
|
||||
"description": "__MSG_app_description__",
|
||||
"version": "1.7.13",
|
||||
"version": "1.7.15",
|
||||
"default_locale": "en",
|
||||
"author": "Gabe<yugang2002@gmail.com>",
|
||||
"homepage_url": "https://github.com/fishjar/kiss-translator",
|
||||
|
||||
@@ -9,6 +9,7 @@ import {
|
||||
OPT_TRANS_BAIDU,
|
||||
OPT_TRANS_TENCENT,
|
||||
OPT_TRANS_OPENAI,
|
||||
OPT_TRANS_GEMINI,
|
||||
OPT_TRANS_CLOUDFLAREAI,
|
||||
OPT_TRANS_CUSTOMIZE,
|
||||
URL_CACHE_TRAN,
|
||||
@@ -181,6 +182,10 @@ export const apiTranslate = async ({
|
||||
trText = res?.choices?.[0].message.content;
|
||||
isSame = text === trText;
|
||||
break;
|
||||
case OPT_TRANS_GEMINI:
|
||||
trText = res?.candidates?.[0].content.parts[0].text;
|
||||
isSame = text === trText;
|
||||
break;
|
||||
case OPT_TRANS_CLOUDFLAREAI:
|
||||
trText = res?.result?.translated_text;
|
||||
isSame = text === trText;
|
||||
|
||||
@@ -7,13 +7,12 @@ import {
|
||||
MSG_OPEN_OPTIONS,
|
||||
MSG_SAVE_RULE,
|
||||
MSG_TRANS_TOGGLE_STYLE,
|
||||
MSG_TRANSLATE_SELECTED,
|
||||
MSG_OPEN_TRANBOX,
|
||||
MSG_CONTEXT_MENUS,
|
||||
CMD_TOGGLE_TRANSLATE,
|
||||
CMD_TOGGLE_STYLE,
|
||||
CMD_OPEN_OPTIONS,
|
||||
CMD_OPEN_TRANBOX,
|
||||
CMD_TRANSLATE_SELECTED,
|
||||
} from "./config";
|
||||
import { getSettingWithDefault, tryInitDefaultData } from "./libs/storage";
|
||||
import { trySyncSettingAndRules } from "./libs/sync";
|
||||
@@ -26,22 +25,9 @@ import { saveRule } from "./libs/rules";
|
||||
globalThis.ContextType = "BACKGROUND";
|
||||
|
||||
/**
|
||||
* 插件安装
|
||||
* 添加右键菜单
|
||||
*/
|
||||
browser.runtime.onInstalled.addListener(() => {
|
||||
tryInitDefaultData();
|
||||
|
||||
// 右键菜单
|
||||
browser.contextMenus.create({
|
||||
id: CMD_TRANSLATE_SELECTED,
|
||||
title: browser.i18n.getMessage("translate_selected"),
|
||||
contexts: ["selection"],
|
||||
});
|
||||
browser.contextMenus.create({
|
||||
id: "selection_separator",
|
||||
type: "separator",
|
||||
contexts: ["selection"],
|
||||
});
|
||||
function addContextMenus() {
|
||||
browser.contextMenus.create({
|
||||
id: CMD_TOGGLE_TRANSLATE,
|
||||
title: browser.i18n.getMessage("toggle_translate"),
|
||||
@@ -53,13 +39,13 @@ browser.runtime.onInstalled.addListener(() => {
|
||||
contexts: ["all"],
|
||||
});
|
||||
browser.contextMenus.create({
|
||||
id: "options_separator",
|
||||
type: "separator",
|
||||
id: CMD_OPEN_TRANBOX,
|
||||
title: browser.i18n.getMessage("open_tranbox"),
|
||||
contexts: ["all"],
|
||||
});
|
||||
browser.contextMenus.create({
|
||||
id: CMD_OPEN_TRANBOX,
|
||||
title: browser.i18n.getMessage("open_tranbox"),
|
||||
id: "options_separator",
|
||||
type: "separator",
|
||||
contexts: ["all"],
|
||||
});
|
||||
browser.contextMenus.create({
|
||||
@@ -67,6 +53,23 @@ browser.runtime.onInstalled.addListener(() => {
|
||||
title: browser.i18n.getMessage("open_options"),
|
||||
contexts: ["all"],
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 清除右键菜单
|
||||
*/
|
||||
function removeContextMenus() {
|
||||
browser.contextMenus.removeAll();
|
||||
}
|
||||
|
||||
/**
|
||||
* 插件安装
|
||||
*/
|
||||
browser.runtime.onInstalled.addListener(() => {
|
||||
tryInitDefaultData();
|
||||
|
||||
// 右键菜单
|
||||
addContextMenus();
|
||||
});
|
||||
|
||||
/**
|
||||
@@ -76,14 +79,24 @@ browser.runtime.onStartup.addListener(async () => {
|
||||
// 同步数据
|
||||
await trySyncSettingAndRules();
|
||||
|
||||
const {
|
||||
clearCache,
|
||||
contextMenus = true,
|
||||
subrulesList,
|
||||
} = await getSettingWithDefault();
|
||||
|
||||
// 清除缓存
|
||||
const setting = await getSettingWithDefault();
|
||||
if (setting.clearCache) {
|
||||
if (clearCache) {
|
||||
tryClearCaches();
|
||||
}
|
||||
|
||||
// 右键菜单
|
||||
if (!contextMenus) {
|
||||
removeContextMenus();
|
||||
}
|
||||
|
||||
// 同步订阅规则
|
||||
trySyncAllSubRules(setting);
|
||||
trySyncAllSubRules({ subrulesList });
|
||||
});
|
||||
|
||||
/**
|
||||
@@ -117,6 +130,14 @@ browser.runtime.onMessage.addListener(
|
||||
case MSG_SAVE_RULE:
|
||||
saveRule(args);
|
||||
break;
|
||||
case MSG_CONTEXT_MENUS:
|
||||
const { contextMenus } = args;
|
||||
if (contextMenus) {
|
||||
addContextMenus();
|
||||
} else {
|
||||
removeContextMenus();
|
||||
}
|
||||
break;
|
||||
default:
|
||||
sendResponse({ error: `message action is unavailable: ${action}` });
|
||||
}
|
||||
@@ -143,6 +164,9 @@ browser.commands.onCommand.addListener((command) => {
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* 监听右键菜单
|
||||
*/
|
||||
browser.contextMenus.onClicked.addListener(({ menuItemId }) => {
|
||||
switch (menuItemId) {
|
||||
case CMD_TOGGLE_TRANSLATE:
|
||||
@@ -151,9 +175,6 @@ browser.contextMenus.onClicked.addListener(({ menuItemId }) => {
|
||||
case CMD_TOGGLE_STYLE:
|
||||
sendTabMsg(MSG_TRANS_TOGGLE_STYLE);
|
||||
break;
|
||||
case CMD_TRANSLATE_SELECTED:
|
||||
sendTabMsg(MSG_TRANSLATE_SELECTED);
|
||||
break;
|
||||
case CMD_OPEN_TRANBOX:
|
||||
sendTabMsg(MSG_OPEN_TRANBOX);
|
||||
break;
|
||||
|
||||
180
src/common.js
180
src/common.js
@@ -8,27 +8,80 @@ import {
|
||||
MSG_TRANS_TOGGLE_STYLE,
|
||||
MSG_TRANS_GETRULE,
|
||||
MSG_TRANS_PUTRULE,
|
||||
MSG_OPEN_TRANBOX,
|
||||
APP_LCNAME,
|
||||
DEFAULT_TRANBOX_SETTING,
|
||||
} from "./config";
|
||||
import { getRulesWithDefault, getFabWithDefault } from "./libs/storage";
|
||||
import { getFabWithDefault, getSettingWithDefault } from "./libs/storage";
|
||||
import { Translator } from "./libs/translator";
|
||||
import { sendIframeMsg, sendParentMsg } from "./libs/iframe";
|
||||
import { matchRule } from "./libs/rules";
|
||||
import { isIframe, sendIframeMsg, sendParentMsg } from "./libs/iframe";
|
||||
import Slection from "./views/Selection";
|
||||
import { touchTapListener } from "./libs/touch";
|
||||
import { debounce } from "./libs/utils";
|
||||
import { debounce, genEventName } from "./libs/utils";
|
||||
import { handlePing, injectScript } from "./libs/gm";
|
||||
import { browser } from "./libs/browser";
|
||||
import { runWebfix } from "./libs/webfix";
|
||||
import { matchRule } from "./libs/rules";
|
||||
import { trySyncAllSubRules } from "./libs/subRules";
|
||||
import { isInBlacklist } from "./libs/blacklist";
|
||||
import inputTranslate from "./libs/inputTranslate";
|
||||
|
||||
export async function runTranslator(setting) {
|
||||
const href = document.location.href;
|
||||
const rules = await getRulesWithDefault();
|
||||
const rule = await matchRule(rules, href, setting);
|
||||
const translator = new Translator(rule, setting);
|
||||
|
||||
return { translator, rule };
|
||||
/**
|
||||
* 油猴脚本设置页面
|
||||
*/
|
||||
function runSettingPage() {
|
||||
if (GM?.info?.script?.grant?.includes("unsafeWindow")) {
|
||||
unsafeWindow.GM = GM;
|
||||
unsafeWindow.APP_INFO = {
|
||||
name: process.env.REACT_APP_NAME,
|
||||
version: process.env.REACT_APP_VERSION,
|
||||
};
|
||||
} else {
|
||||
const ping = genEventName();
|
||||
window.addEventListener(ping, handlePing);
|
||||
// window.eval(`(${injectScript})("${ping}")`); // eslint-disable-line
|
||||
const script = document.createElement("script");
|
||||
script.textContent = `(${injectScript})("${ping}")`;
|
||||
document.head.append(script);
|
||||
}
|
||||
}
|
||||
|
||||
export function runIframe(setting) {
|
||||
/**
|
||||
* 插件监听后端事件
|
||||
* @param {*} translator
|
||||
*/
|
||||
function runtimeListener(translator) {
|
||||
browser?.runtime.onMessage.addListener(async ({ action, args }) => {
|
||||
switch (action) {
|
||||
case MSG_TRANS_TOGGLE:
|
||||
translator.toggle();
|
||||
sendIframeMsg(MSG_TRANS_TOGGLE);
|
||||
break;
|
||||
case MSG_TRANS_TOGGLE_STYLE:
|
||||
translator.toggleStyle();
|
||||
sendIframeMsg(MSG_TRANS_TOGGLE_STYLE);
|
||||
break;
|
||||
case MSG_TRANS_GETRULE:
|
||||
break;
|
||||
case MSG_TRANS_PUTRULE:
|
||||
translator.updateRule(args);
|
||||
sendIframeMsg(MSG_TRANS_PUTRULE, args);
|
||||
break;
|
||||
case MSG_OPEN_TRANBOX:
|
||||
window.dispatchEvent(new CustomEvent(MSG_OPEN_TRANBOX));
|
||||
break;
|
||||
default:
|
||||
return { error: `message action is unavailable: ${action}` };
|
||||
}
|
||||
return { data: translator.rule };
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* iframe 页面执行
|
||||
* @param {*} setting
|
||||
*/
|
||||
function runIframe(setting) {
|
||||
let translator;
|
||||
window.addEventListener("message", (e) => {
|
||||
const { action, args } = e.data || {};
|
||||
@@ -52,7 +105,12 @@ export function runIframe(setting) {
|
||||
sendParentMsg(MSG_TRANS_GETRULE);
|
||||
}
|
||||
|
||||
export async function showFab(translator) {
|
||||
/**
|
||||
* 悬浮按钮
|
||||
* @param {*} translator
|
||||
* @returns
|
||||
*/
|
||||
async function showFab(translator) {
|
||||
const fab = await getFabWithDefault();
|
||||
if (fab.isHide) {
|
||||
return;
|
||||
@@ -80,7 +138,13 @@ export async function showFab(translator) {
|
||||
);
|
||||
}
|
||||
|
||||
export function showTransbox({
|
||||
/**
|
||||
* 划词翻译
|
||||
* @param {*} param0
|
||||
* @returns
|
||||
*/
|
||||
function showTransbox({
|
||||
contextMenus = true,
|
||||
tranboxSetting = DEFAULT_TRANBOX_SETTING,
|
||||
transApis,
|
||||
}) {
|
||||
@@ -104,13 +168,21 @@ export function showTransbox({
|
||||
ReactDOM.createRoot(shadowRootElement).render(
|
||||
<React.StrictMode>
|
||||
<CacheProvider value={cache}>
|
||||
<Slection tranboxSetting={tranboxSetting} transApis={transApis} />
|
||||
<Slection
|
||||
contextMenus={contextMenus}
|
||||
tranboxSetting={tranboxSetting}
|
||||
transApis={transApis}
|
||||
/>
|
||||
</CacheProvider>
|
||||
</React.StrictMode>
|
||||
);
|
||||
}
|
||||
|
||||
export function windowListener(rule) {
|
||||
/**
|
||||
* 监听来自iframe页面消息
|
||||
* @param {*} rule
|
||||
*/
|
||||
function windowListener(rule) {
|
||||
window.addEventListener("message", (e) => {
|
||||
const { action } = e.data || {};
|
||||
switch (action) {
|
||||
@@ -122,14 +194,23 @@ export function windowListener(rule) {
|
||||
});
|
||||
}
|
||||
|
||||
export function showErr(message) {
|
||||
/**
|
||||
* 显示错误信息到页面顶部
|
||||
* @param {*} message
|
||||
*/
|
||||
function showErr(message) {
|
||||
const $err = document.createElement("div");
|
||||
$err.innerText = `KISS-Translator: ${message}`;
|
||||
$err.style.cssText = "background:red; color:#fff;";
|
||||
document.body.prepend($err);
|
||||
}
|
||||
|
||||
export function touchOperation(translator) {
|
||||
/**
|
||||
* 监听触屏操作
|
||||
* @param {*} translator
|
||||
* @returns
|
||||
*/
|
||||
function touchOperation(translator) {
|
||||
const { touchTranslate = 2 } = translator.setting;
|
||||
if (touchTranslate === 0) {
|
||||
return;
|
||||
@@ -141,3 +222,66 @@ export function touchOperation(translator) {
|
||||
});
|
||||
touchTapListener(handleTap, touchTranslate);
|
||||
}
|
||||
|
||||
/**
|
||||
* 入口函数
|
||||
*/
|
||||
export async function run(isUserscript = false) {
|
||||
try {
|
||||
const href = document.location.href;
|
||||
|
||||
// 设置页面
|
||||
if (
|
||||
isUserscript &&
|
||||
(href.includes(process.env.REACT_APP_OPTIONSPAGE_DEV) ||
|
||||
href.includes(process.env.REACT_APP_OPTIONSPAGE) ||
|
||||
href.includes(process.env.REACT_APP_OPTIONSPAGE2))
|
||||
) {
|
||||
runSettingPage();
|
||||
return;
|
||||
}
|
||||
|
||||
// 读取设置信息
|
||||
const setting = await getSettingWithDefault();
|
||||
|
||||
// 黑名单
|
||||
if (isInBlacklist(href, setting)) {
|
||||
return;
|
||||
}
|
||||
|
||||
// 适配iframe
|
||||
if (isIframe) {
|
||||
runIframe(setting);
|
||||
return;
|
||||
}
|
||||
|
||||
// 不规范网页修复
|
||||
await runWebfix(setting);
|
||||
|
||||
// 翻译网页
|
||||
const rule = await matchRule(href, setting);
|
||||
const translator = new Translator(rule, setting);
|
||||
|
||||
// 监听消息
|
||||
windowListener(rule);
|
||||
!isUserscript && runtimeListener(translator);
|
||||
|
||||
// 输入框翻译
|
||||
inputTranslate(setting);
|
||||
|
||||
// 划词翻译
|
||||
showTransbox(setting);
|
||||
|
||||
// 浮球按钮
|
||||
await showFab(translator);
|
||||
|
||||
// 触屏操作
|
||||
touchOperation(translator);
|
||||
|
||||
// 同步订阅规则
|
||||
isUserscript && (await trySyncAllSubRules(setting));
|
||||
} catch (err) {
|
||||
console.error("[KISS-Translator]", err);
|
||||
showErr(err.message);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -215,6 +215,14 @@ export const I18N = {
|
||||
zh: `目标语言`,
|
||||
en: `Target Language`,
|
||||
},
|
||||
to_lang2: {
|
||||
zh: `第二目标语言`,
|
||||
en: `Target Language 2`,
|
||||
},
|
||||
to_lang2_helper: {
|
||||
zh: `设定后,与目标语言产生互译效果,但依赖远程语言识别。`,
|
||||
en: `After setting, it will produce mutual translation effect with the target language, but it relies on remote language recognition.`,
|
||||
},
|
||||
text_style: {
|
||||
zh: `文字样式`,
|
||||
en: `Text Style`,
|
||||
@@ -335,6 +343,10 @@ export const I18N = {
|
||||
zh: `高亮`,
|
||||
en: `Highlight`,
|
||||
},
|
||||
blockquote: {
|
||||
zh: `引用`,
|
||||
en: `Blockquote`,
|
||||
},
|
||||
diy_style: {
|
||||
zh: `自定义样式`,
|
||||
en: `Custom Style`,
|
||||
@@ -352,8 +364,8 @@ export const I18N = {
|
||||
en: `URL pattern`,
|
||||
},
|
||||
pattern_helper: {
|
||||
zh: `1、支持星号(*)通配符。2、多个URL支持英文逗号“,”分隔。`,
|
||||
en: `1. The asterisk (*) wildcard is supported. 2. Multiple URLs can be separated by English commas ",".`,
|
||||
zh: `1、支持星号(*)通配符。2、多个URL用英文逗号“,”分隔。`,
|
||||
en: `1. The asterisk (*) wildcard is supported. 2. Multiple URLs separated by English commas ",".`,
|
||||
},
|
||||
selector_helper: {
|
||||
zh: `1、遵循CSS选择器语法。2、留空表示采用全局设置。3、多个CSS选择器之间用“;”隔开。4、“shadow root”选择器和内部选择器用“>>>”隔开。`,
|
||||
@@ -632,12 +644,8 @@ export const I18N = {
|
||||
en: `Use Selection Translate`,
|
||||
},
|
||||
trigger_tranbox_shortcut: {
|
||||
zh: `显示翻译框快捷键`,
|
||||
en: `Toggle Translate Box Shortcut`,
|
||||
},
|
||||
trigger_transel_shortcut: {
|
||||
zh: `翻译选中文字快捷键`,
|
||||
en: `Translate Selected Shortcut`,
|
||||
zh: `显示翻译框/翻译选中文字快捷键`,
|
||||
en: `Open Translate Popup/Translate Selected Shortcut`,
|
||||
},
|
||||
tranbtn_offset_x: {
|
||||
zh: `翻译按钮偏移X(0-100)`,
|
||||
@@ -683,4 +691,20 @@ export const I18N = {
|
||||
zh: `四指轻触`,
|
||||
en: `Four finger tap`,
|
||||
},
|
||||
translate_blacklist: {
|
||||
zh: `禁用翻译名单`,
|
||||
en: `Translate Blacklist`,
|
||||
},
|
||||
disable_langs: {
|
||||
zh: `不翻译的语言`,
|
||||
en: `Disable Languages`,
|
||||
},
|
||||
disable_langs_helper: {
|
||||
zh: `此功能依赖准确的语言检测,建议启用远程语言检测。`,
|
||||
en: `This feature relies on accurate language detection. It is recommended to enable remote language detection.`,
|
||||
},
|
||||
add_context_menus: {
|
||||
zh: `添加右键菜单`,
|
||||
en: `Add Context Menus`,
|
||||
},
|
||||
};
|
||||
|
||||
@@ -34,7 +34,6 @@ export const CMD_TOGGLE_TRANSLATE = "toggleTranslate";
|
||||
export const CMD_TOGGLE_STYLE = "toggleStyle";
|
||||
export const CMD_OPEN_OPTIONS = "openOptions";
|
||||
export const CMD_OPEN_TRANBOX = "openTranbox";
|
||||
export const CMD_TRANSLATE_SELECTED = "translateSelected";
|
||||
|
||||
export const CLIENT_WEB = "web";
|
||||
export const CLIENT_CHROME = "chrome";
|
||||
@@ -60,11 +59,11 @@ export const MSG_OPEN_OPTIONS = "open_options";
|
||||
export const MSG_SAVE_RULE = "save_rule";
|
||||
export const MSG_TRANS_TOGGLE = "trans_toggle";
|
||||
export const MSG_TRANS_TOGGLE_STYLE = "trans_toggle_style";
|
||||
export const MSG_TRANSLATE_SELECTED = "translate_selected";
|
||||
export const MSG_OPEN_TRANBOX = "open_tranbox";
|
||||
export const MSG_TRANS_GETRULE = "trans_getrule";
|
||||
export const MSG_TRANS_PUTRULE = "trans_putrule";
|
||||
export const MSG_TRANS_CURRULE = "trans_currule";
|
||||
export const MSG_CONTEXT_MENUS = "context_menus";
|
||||
|
||||
export const THEME_LIGHT = "light";
|
||||
export const THEME_DARK = "dark";
|
||||
@@ -95,6 +94,7 @@ export const OPT_TRANS_DEEPLFREE = "DeepLFree";
|
||||
export const OPT_TRANS_BAIDU = "Baidu";
|
||||
export const OPT_TRANS_TENCENT = "Tencent";
|
||||
export const OPT_TRANS_OPENAI = "OpenAI";
|
||||
export const OPT_TRANS_GEMINI = "Gemini";
|
||||
export const OPT_TRANS_CLOUDFLAREAI = "CloudflareAI";
|
||||
export const OPT_TRANS_CUSTOMIZE = "Custom";
|
||||
export const OPT_TRANS_ALL = [
|
||||
@@ -106,6 +106,7 @@ export const OPT_TRANS_ALL = [
|
||||
OPT_TRANS_BAIDU,
|
||||
OPT_TRANS_TENCENT,
|
||||
OPT_TRANS_OPENAI,
|
||||
OPT_TRANS_GEMINI,
|
||||
OPT_TRANS_CLOUDFLAREAI,
|
||||
OPT_TRANS_CUSTOMIZE,
|
||||
];
|
||||
@@ -228,6 +229,9 @@ export const OPT_LANGS_SPECIAL = {
|
||||
[OPT_TRANS_OPENAI]: new Map(
|
||||
OPT_LANGS_FROM.map(([key, val]) => [key, val.split(" - ")[0]])
|
||||
),
|
||||
[OPT_TRANS_GEMINI]: new Map(
|
||||
OPT_LANGS_FROM.map(([key, val]) => [key, val.split(" - ")[0]])
|
||||
),
|
||||
[OPT_TRANS_CLOUDFLAREAI]: new Map([
|
||||
["auto", ""],
|
||||
["zh-CN", "chinese"],
|
||||
@@ -269,6 +273,7 @@ export const OPT_STYLE_DASHLINE = "dash_line"; // 虚线
|
||||
export const OPT_STYLE_WAVYLINE = "wavy_line"; // 波浪线
|
||||
export const OPT_STYLE_FUZZY = "fuzzy"; // 模糊
|
||||
export const OPT_STYLE_HIGHLIGHT = "highlight"; // 高亮
|
||||
export const OPT_STYLE_BLOCKQUOTE = "blockquote"; // 引用
|
||||
export const OPT_STYLE_DIY = "diy_style"; // 自定义样式
|
||||
export const OPT_STYLE_ALL = [
|
||||
OPT_STYLE_NONE,
|
||||
@@ -278,6 +283,7 @@ export const OPT_STYLE_ALL = [
|
||||
OPT_STYLE_WAVYLINE,
|
||||
OPT_STYLE_FUZZY,
|
||||
OPT_STYLE_HIGHLIGHT,
|
||||
OPT_STYLE_BLOCKQUOTE,
|
||||
OPT_STYLE_DIY,
|
||||
];
|
||||
export const OPT_STYLE_USE_COLOR = [
|
||||
@@ -286,6 +292,7 @@ export const OPT_STYLE_USE_COLOR = [
|
||||
OPT_STYLE_DASHLINE,
|
||||
OPT_STYLE_WAVYLINE,
|
||||
OPT_STYLE_HIGHLIGHT,
|
||||
OPT_STYLE_BLOCKQUOTE,
|
||||
];
|
||||
|
||||
export const OPT_MOUSEKEY_DISABLE = "mk_disable";
|
||||
@@ -306,6 +313,7 @@ export const DEFAULT_FETCH_INTERVAL = 100; // 默认任务间隔时间
|
||||
|
||||
export const PROMPT_PLACE_FROM = "{{from}}"; // 占位符
|
||||
export const PROMPT_PLACE_TO = "{{to}}"; // 占位符
|
||||
export const PROMPT_PLACE_TEXT = "{{text}}"; // 占位符
|
||||
|
||||
export const DEFAULT_COLOR = "#209CEE"; // 默认高亮背景色/线条颜色
|
||||
|
||||
@@ -337,15 +345,14 @@ export const DEFAULT_INPUT_RULE = {
|
||||
};
|
||||
|
||||
// 划词翻译
|
||||
export const DEFAULT_TRANBOX_SHORTCUT = ["AltLeft", "KeyB"];
|
||||
export const DEFAULT_TRANSEL_SHORTCUT = ["AltLeft", "KeyS"];
|
||||
export const DEFAULT_TRANBOX_SHORTCUT = ["AltLeft", "KeyS"];
|
||||
export const DEFAULT_TRANBOX_SETTING = {
|
||||
transOpen: true,
|
||||
translator: OPT_TRANS_MICROSOFT,
|
||||
fromLang: "auto",
|
||||
toLang: "zh-CN",
|
||||
toLang2: "en",
|
||||
tranboxShortcut: DEFAULT_TRANBOX_SHORTCUT,
|
||||
transelShortcut: DEFAULT_TRANSEL_SHORTCUT,
|
||||
btnOffsetX: 10,
|
||||
btnOffsetY: 10,
|
||||
hideTranBtn: false,
|
||||
@@ -387,6 +394,12 @@ export const DEFAULT_TRANS_APIS = {
|
||||
model: "gpt-4",
|
||||
prompt: `You will be provided with a sentence in ${PROMPT_PLACE_FROM}, and your task is to translate it into ${PROMPT_PLACE_TO}.`,
|
||||
},
|
||||
[OPT_TRANS_GEMINI]: {
|
||||
url: "https://generativelanguage.googleapis.com/v1/models",
|
||||
key: "",
|
||||
model: "gemini-pro",
|
||||
prompt: `Translate the following text from ${PROMPT_PLACE_FROM} to ${PROMPT_PLACE_TO}:\n\n${PROMPT_PLACE_TEXT}`,
|
||||
},
|
||||
[OPT_TRANS_CLOUDFLAREAI]: {
|
||||
url: "https://api.cloudflare.com/client/v4/accounts/{ACCOUNT_ID}/ai/run/@cf/meta/m2m100-1.2b",
|
||||
key: "",
|
||||
@@ -406,12 +419,19 @@ export const DEFAULT_SHORTCUTS = {
|
||||
[OPT_SHORTCUT_TRANSLATE]: ["AltLeft", "KeyQ"],
|
||||
[OPT_SHORTCUT_STYLE]: ["AltLeft", "KeyC"],
|
||||
[OPT_SHORTCUT_POPUP]: ["AltLeft", "KeyK"],
|
||||
[OPT_SHORTCUT_SETTING]: ["AltLeft", "KeyN"],
|
||||
[OPT_SHORTCUT_SETTING]: ["AltLeft", "KeyO"],
|
||||
};
|
||||
|
||||
export const TRANS_MIN_LENGTH = 5; // 最短翻译长度
|
||||
export const TRANS_MAX_LENGTH = 5000; // 最长翻译长度
|
||||
export const TRANS_NEWLINE_LENGTH = 20; // 换行字符数
|
||||
export const DEFAULT_BLACKLIST = [
|
||||
"https://fishjar.github.io/kiss-translator/options.html",
|
||||
"https://translate.google.com",
|
||||
"https://www.deepl.com/translator",
|
||||
"oapi.dingtalk.com",
|
||||
"login.dingtalk.com",
|
||||
]; // 禁用翻译名单
|
||||
|
||||
export const DEFAULT_SETTING = {
|
||||
darkMode: false, // 深色模式
|
||||
@@ -425,6 +445,7 @@ export const DEFAULT_SETTING = {
|
||||
injectRules: true, // 是否注入订阅规则
|
||||
injectWebfix: true, // 是否注入修复补丁
|
||||
detectRemote: false, // 是否使用远程语言检测
|
||||
contextMenus: true, // 是否添加右键菜单
|
||||
subrulesList: DEFAULT_SUBRULES_LIST, // 订阅列表
|
||||
owSubrule: DEFAULT_OW_RULE, // 覆写订阅规则
|
||||
transApis: DEFAULT_TRANS_APIS, // 翻译接口
|
||||
@@ -433,6 +454,8 @@ export const DEFAULT_SETTING = {
|
||||
inputRule: DEFAULT_INPUT_RULE, // 输入框设置
|
||||
tranboxSetting: DEFAULT_TRANBOX_SETTING, // 划词翻译设置
|
||||
touchTranslate: 2, // 触屏翻译
|
||||
blacklist: DEFAULT_BLACKLIST.join(",\n"), // 禁用翻译名单
|
||||
disableLangs: [], // 不翻译的语言
|
||||
};
|
||||
|
||||
export const DEFAULT_RULES = [GLOBLA_RULE];
|
||||
|
||||
@@ -1,89 +1,3 @@
|
||||
import { browser } from "./libs/browser";
|
||||
import {
|
||||
MSG_TRANS_TOGGLE,
|
||||
MSG_TRANS_TOGGLE_STYLE,
|
||||
MSG_TRANSLATE_SELECTED,
|
||||
MSG_OPEN_TRANBOX,
|
||||
MSG_TRANS_GETRULE,
|
||||
MSG_TRANS_PUTRULE,
|
||||
} from "./config";
|
||||
import { getSettingWithDefault } from "./libs/storage";
|
||||
import { isIframe, sendIframeMsg } from "./libs/iframe";
|
||||
import { runWebfix } from "./libs/webfix";
|
||||
import {
|
||||
runIframe,
|
||||
runTranslator,
|
||||
showFab,
|
||||
showTransbox,
|
||||
windowListener,
|
||||
showErr,
|
||||
touchOperation,
|
||||
} from "./common";
|
||||
import { run } from "./common";
|
||||
|
||||
function runtimeListener(translator) {
|
||||
browser?.runtime.onMessage.addListener(async ({ action, args }) => {
|
||||
switch (action) {
|
||||
case MSG_TRANS_TOGGLE:
|
||||
translator.toggle();
|
||||
sendIframeMsg(MSG_TRANS_TOGGLE);
|
||||
break;
|
||||
case MSG_TRANS_TOGGLE_STYLE:
|
||||
translator.toggleStyle();
|
||||
sendIframeMsg(MSG_TRANS_TOGGLE_STYLE);
|
||||
break;
|
||||
case MSG_TRANS_GETRULE:
|
||||
break;
|
||||
case MSG_TRANS_PUTRULE:
|
||||
translator.updateRule(args);
|
||||
sendIframeMsg(MSG_TRANS_PUTRULE, args);
|
||||
break;
|
||||
case MSG_TRANSLATE_SELECTED:
|
||||
window.dispatchEvent(new CustomEvent(MSG_TRANSLATE_SELECTED));
|
||||
break;
|
||||
case MSG_OPEN_TRANBOX:
|
||||
window.dispatchEvent(new CustomEvent(MSG_OPEN_TRANBOX));
|
||||
break;
|
||||
default:
|
||||
return { error: `message action is unavailable: ${action}` };
|
||||
}
|
||||
return { data: translator.rule };
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 入口函数
|
||||
*/
|
||||
(async () => {
|
||||
try {
|
||||
// 读取设置信息
|
||||
const setting = await getSettingWithDefault();
|
||||
|
||||
// 适配iframe
|
||||
if (isIframe) {
|
||||
runIframe(setting);
|
||||
return;
|
||||
}
|
||||
|
||||
// 不规范网页修复
|
||||
await runWebfix(setting);
|
||||
|
||||
// 翻译网页
|
||||
const { translator, rule } = await runTranslator(setting);
|
||||
|
||||
// 监听消息
|
||||
windowListener(rule);
|
||||
runtimeListener(translator);
|
||||
|
||||
// 划词翻译
|
||||
showTransbox(setting);
|
||||
|
||||
// 浮球按钮
|
||||
await showFab(translator);
|
||||
|
||||
// 触屏操作
|
||||
touchOperation(translator);
|
||||
} catch (err) {
|
||||
console.error("[KISS-Translator]", err);
|
||||
showErr(err.message);
|
||||
}
|
||||
})();
|
||||
run();
|
||||
|
||||
@@ -24,7 +24,11 @@ export function useTranslate(q, rule, setting) {
|
||||
setLoading(true);
|
||||
|
||||
const deLang = await tryDetectLang(q, setting.detectRemote);
|
||||
if (deLang && toLang.includes(deLang)) {
|
||||
const disableLangs = setting.disableLangs || [];
|
||||
if (
|
||||
deLang &&
|
||||
(toLang.includes(deLang) || disableLangs.includes(deLang))
|
||||
) {
|
||||
setSamelang(true);
|
||||
} else {
|
||||
const [trText, isSame] = await apiTranslate({
|
||||
|
||||
13
src/libs/blacklist.js
Normal file
13
src/libs/blacklist.js
Normal file
@@ -0,0 +1,13 @@
|
||||
import { isMatch } from "./utils";
|
||||
import { DEFAULT_BLACKLIST } from "../config";
|
||||
|
||||
/**
|
||||
* 检查是否在黑名单中
|
||||
* @param {*} href
|
||||
* @param {*} param1
|
||||
* @returns
|
||||
*/
|
||||
export const isInBlacklist = (
|
||||
href,
|
||||
{ blacklist = DEFAULT_BLACKLIST.join(",\n") }
|
||||
) => blacklist.split(",").some((url) => isMatch(href, url.trim()));
|
||||
205
src/libs/inputTranslate.js
Normal file
205
src/libs/inputTranslate.js
Normal file
@@ -0,0 +1,205 @@
|
||||
import {
|
||||
DEFAULT_INPUT_RULE,
|
||||
DEFAULT_TRANS_APIS,
|
||||
DEFAULT_INPUT_SHORTCUT,
|
||||
OPT_LANGS_LIST,
|
||||
} from "../config";
|
||||
import { genEventName, removeEndchar, matchInputStr, sleep } from "./utils";
|
||||
import { stepShortcutRegister } from "./shortcut";
|
||||
import { apiTranslate } from "../apis";
|
||||
import { tryDetectLang } from ".";
|
||||
import { loadingSvg } from "./svg";
|
||||
|
||||
function isInputNode(node) {
|
||||
return node.nodeName === "INPUT" || node.nodeName === "TEXTAREA";
|
||||
}
|
||||
|
||||
function isEditAbleNode(node) {
|
||||
return node.hasAttribute("contenteditable");
|
||||
}
|
||||
|
||||
function selectContent(node) {
|
||||
node.focus();
|
||||
const range = document.createRange();
|
||||
range.selectNodeContents(node);
|
||||
|
||||
const selection = window.getSelection();
|
||||
selection.removeAllRanges();
|
||||
selection.addRange(range);
|
||||
}
|
||||
|
||||
function pasteContentEvent(node, text) {
|
||||
node.focus();
|
||||
const data = new DataTransfer();
|
||||
data.setData("text/plain", text);
|
||||
|
||||
const event = new ClipboardEvent("paste", { clipboardData: data });
|
||||
document.dispatchEvent(event);
|
||||
data.clearData();
|
||||
}
|
||||
|
||||
function pasteContentCommand(node, text) {
|
||||
node.focus();
|
||||
document.execCommand("insertText", false, text);
|
||||
}
|
||||
|
||||
function collapseToEnd(node) {
|
||||
node.focus();
|
||||
const selection = window.getSelection();
|
||||
selection.collapseToEnd();
|
||||
}
|
||||
|
||||
function getNodeText(node) {
|
||||
if (isInputNode(node)) {
|
||||
return node.value;
|
||||
}
|
||||
return node.innerText || node.textContent || "";
|
||||
}
|
||||
|
||||
function addLoading(node, loadingId) {
|
||||
const div = document.createElement("div");
|
||||
div.id = loadingId;
|
||||
div.innerHTML = loadingSvg;
|
||||
div.style.cssText = `
|
||||
width: ${node.offsetWidth}px;
|
||||
height: ${node.offsetHeight}px;
|
||||
line-height: ${node.offsetHeight}px;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
left: ${node.offsetLeft}px;
|
||||
top: ${node.offsetTop}px;
|
||||
z-index: 2147483647;
|
||||
`;
|
||||
node.offsetParent?.appendChild(div);
|
||||
}
|
||||
|
||||
function removeLoading(node, loadingId) {
|
||||
const div = node.offsetParent.querySelector(`#${loadingId}`);
|
||||
if (div) {
|
||||
div.remove();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 输入框翻译
|
||||
*/
|
||||
export default function inputTranslate ({
|
||||
inputRule: {
|
||||
transOpen,
|
||||
triggerShortcut,
|
||||
translator,
|
||||
fromLang,
|
||||
toLang,
|
||||
triggerCount,
|
||||
triggerTime,
|
||||
transSign,
|
||||
} = DEFAULT_INPUT_RULE,
|
||||
transApis,
|
||||
detectRemote,
|
||||
}) {
|
||||
if (!transOpen) {
|
||||
return;
|
||||
}
|
||||
|
||||
const apiSetting = transApis?.[translator] || DEFAULT_TRANS_APIS[translator];
|
||||
if (triggerShortcut.length === 0) {
|
||||
triggerShortcut = DEFAULT_INPUT_SHORTCUT;
|
||||
triggerCount = 1;
|
||||
}
|
||||
|
||||
stepShortcutRegister(
|
||||
triggerShortcut,
|
||||
async () => {
|
||||
let node = document.activeElement;
|
||||
|
||||
if (!node) {
|
||||
return;
|
||||
}
|
||||
|
||||
while (node.shadowRoot) {
|
||||
node = node.shadowRoot.activeElement;
|
||||
}
|
||||
|
||||
if (!isInputNode(node) && !isEditAbleNode(node)) {
|
||||
return;
|
||||
}
|
||||
|
||||
let initText = getNodeText(node);
|
||||
if (triggerShortcut.length === 1 && triggerShortcut[0].length === 1) {
|
||||
// todo: remove multiple char
|
||||
initText = removeEndchar(initText, triggerShortcut[0], triggerCount);
|
||||
}
|
||||
if (!initText.trim()) {
|
||||
return;
|
||||
}
|
||||
|
||||
let text = initText;
|
||||
if (transSign) {
|
||||
const res = matchInputStr(text, transSign);
|
||||
if (res) {
|
||||
let lang = res[1];
|
||||
if (lang === "zh" || lang === "cn") {
|
||||
lang = "zh-CN";
|
||||
} else if (lang === "tw" || lang === "hk") {
|
||||
lang = "zh-TW";
|
||||
}
|
||||
if (lang && OPT_LANGS_LIST.includes(lang)) {
|
||||
toLang = lang;
|
||||
}
|
||||
text = res[2];
|
||||
}
|
||||
}
|
||||
|
||||
// console.log("input -->", text);
|
||||
|
||||
const loadingId = "kiss-" + genEventName();
|
||||
try {
|
||||
addLoading(node, loadingId);
|
||||
|
||||
const deLang = await tryDetectLang(text, detectRemote);
|
||||
if (deLang && toLang.includes(deLang)) {
|
||||
return;
|
||||
}
|
||||
|
||||
const [trText, isSame] = await apiTranslate({
|
||||
translator,
|
||||
text,
|
||||
fromLang,
|
||||
toLang,
|
||||
apiSetting,
|
||||
});
|
||||
if (!trText || isSame) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (isInputNode(node)) {
|
||||
node.value = trText;
|
||||
node.dispatchEvent(
|
||||
new Event("input", { bubbles: true, cancelable: true })
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
selectContent(node);
|
||||
await sleep(200);
|
||||
|
||||
pasteContentEvent(node, trText);
|
||||
await sleep(200);
|
||||
|
||||
// todo: use includes?
|
||||
if (getNodeText(node).startsWith(initText)) {
|
||||
pasteContentCommand(node, trText);
|
||||
await sleep(100);
|
||||
} else {
|
||||
collapseToEnd(node);
|
||||
}
|
||||
} catch (err) {
|
||||
console.log("[translate input]", err.message);
|
||||
} finally {
|
||||
removeLoading(node, loadingId);
|
||||
}
|
||||
},
|
||||
triggerCount,
|
||||
triggerTime
|
||||
);
|
||||
}
|
||||
@@ -8,12 +8,14 @@ import {
|
||||
OPT_TRANS_BAIDU,
|
||||
OPT_TRANS_TENCENT,
|
||||
OPT_TRANS_OPENAI,
|
||||
OPT_TRANS_GEMINI,
|
||||
OPT_TRANS_CLOUDFLAREAI,
|
||||
OPT_TRANS_CUSTOMIZE,
|
||||
URL_MICROSOFT_TRAN,
|
||||
URL_TENCENT_TRANSMART,
|
||||
PROMPT_PLACE_FROM,
|
||||
PROMPT_PLACE_TO,
|
||||
PROMPT_PLACE_TEXT,
|
||||
} from "../config";
|
||||
import { msAuth } from "./auth";
|
||||
import { genDeeplFree } from "../apis/deepl";
|
||||
@@ -178,6 +180,37 @@ const genOpenAI = ({ text, from, to, url, key, prompt, model }) => {
|
||||
return [url, init];
|
||||
};
|
||||
|
||||
const genGemini = ({ text, from, to, url, key, prompt, model }) => {
|
||||
prompt = prompt
|
||||
.replaceAll(PROMPT_PLACE_FROM, from)
|
||||
.replaceAll(PROMPT_PLACE_TO, to)
|
||||
.replaceAll(PROMPT_PLACE_TEXT, text);
|
||||
|
||||
const data = {
|
||||
contents: [
|
||||
{
|
||||
// role: "user",
|
||||
parts: [
|
||||
{
|
||||
text: prompt,
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const input = `${url}/${model}:generateContent?key=${key}`;
|
||||
const init = {
|
||||
headers: {
|
||||
"Content-type": "application/json",
|
||||
},
|
||||
method: "POST",
|
||||
body: JSON.stringify(data),
|
||||
};
|
||||
|
||||
return [input, init];
|
||||
};
|
||||
|
||||
const genCloudflareAI = ({ text, from, to, url, key }) => {
|
||||
const data = {
|
||||
text,
|
||||
@@ -241,6 +274,8 @@ export const newTransReq = ({ translator, text, from, to }, apiSetting) => {
|
||||
return genTencent(args);
|
||||
case OPT_TRANS_OPENAI:
|
||||
return genOpenAI(args);
|
||||
case OPT_TRANS_GEMINI:
|
||||
return genGemini(args);
|
||||
case OPT_TRANS_CLOUDFLAREAI:
|
||||
return genCloudflareAI(args);
|
||||
case OPT_TRANS_CUSTOMIZE:
|
||||
|
||||
@@ -21,7 +21,6 @@ import { trySyncRules } from "./sync";
|
||||
* @returns
|
||||
*/
|
||||
export const matchRule = async (
|
||||
rules,
|
||||
href,
|
||||
{
|
||||
injectRules = true,
|
||||
@@ -29,7 +28,7 @@ export const matchRule = async (
|
||||
owSubrule = DEFAULT_OW_RULE,
|
||||
}
|
||||
) => {
|
||||
rules = [...rules];
|
||||
const rules = await getRulesWithDefault();
|
||||
if (injectRules) {
|
||||
try {
|
||||
const selectedSub = subrulesList.find((item) => item.selected);
|
||||
|
||||
@@ -9,101 +9,16 @@ import {
|
||||
SHADOW_KEY,
|
||||
OPT_MOUSEKEY_DISABLE,
|
||||
OPT_MOUSEKEY_MOUSEOVER,
|
||||
DEFAULT_INPUT_RULE,
|
||||
DEFAULT_TRANS_APIS,
|
||||
DEFAULT_INPUT_SHORTCUT,
|
||||
OPT_LANGS_LIST,
|
||||
} from "../config";
|
||||
import Content from "../views/Content";
|
||||
import { updateFetchPool, clearFetchPool } from "./fetch";
|
||||
import {
|
||||
debounce,
|
||||
genEventName,
|
||||
removeEndchar,
|
||||
matchInputStr,
|
||||
sleep,
|
||||
} from "./utils";
|
||||
import { stepShortcutRegister } from "./shortcut";
|
||||
import { apiTranslate } from "../apis";
|
||||
import { tryDetectLang } from ".";
|
||||
import { loadingSvg } from "./svg";
|
||||
|
||||
function isInputNode(node) {
|
||||
return node.nodeName === "INPUT" || node.nodeName === "TEXTAREA";
|
||||
}
|
||||
|
||||
function isEditAbleNode(node) {
|
||||
return node.hasAttribute("contenteditable");
|
||||
}
|
||||
|
||||
function selectContent(node) {
|
||||
node.focus();
|
||||
const range = document.createRange();
|
||||
range.selectNodeContents(node);
|
||||
|
||||
const selection = window.getSelection();
|
||||
selection.removeAllRanges();
|
||||
selection.addRange(range);
|
||||
}
|
||||
|
||||
function pasteContentEvent(node, text) {
|
||||
node.focus();
|
||||
const data = new DataTransfer();
|
||||
data.setData("text/plain", text);
|
||||
|
||||
const event = new ClipboardEvent("paste", { clipboardData: data });
|
||||
document.dispatchEvent(event);
|
||||
data.clearData();
|
||||
}
|
||||
|
||||
function pasteContentCommand(node, text) {
|
||||
node.focus();
|
||||
document.execCommand("insertText", false, text);
|
||||
}
|
||||
|
||||
function collapseToEnd(node) {
|
||||
node.focus();
|
||||
const selection = window.getSelection();
|
||||
selection.collapseToEnd();
|
||||
}
|
||||
|
||||
function getNodeText(node) {
|
||||
if (isInputNode(node)) {
|
||||
return node.value;
|
||||
}
|
||||
return node.innerText || node.textContent || "";
|
||||
}
|
||||
|
||||
function addLoading(node, loadingId) {
|
||||
const div = document.createElement("div");
|
||||
div.id = loadingId;
|
||||
div.innerHTML = loadingSvg;
|
||||
div.style.cssText = `
|
||||
width: ${node.offsetWidth}px;
|
||||
height: ${node.offsetHeight}px;
|
||||
line-height: ${node.offsetHeight}px;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
left: ${node.offsetLeft}px;
|
||||
top: ${node.offsetTop}px;
|
||||
z-index: 2147483647;
|
||||
`;
|
||||
node.offsetParent?.appendChild(div);
|
||||
}
|
||||
|
||||
function removeLoading(node, loadingId) {
|
||||
const div = node.offsetParent.querySelector(`#${loadingId}`);
|
||||
if (div) {
|
||||
div.remove();
|
||||
}
|
||||
}
|
||||
import { debounce, genEventName } from "./utils";
|
||||
|
||||
/**
|
||||
* 翻译类
|
||||
*/
|
||||
export class Translator {
|
||||
_rule = {};
|
||||
_inputRule = {};
|
||||
_setting = {};
|
||||
_rootNodes = new Set();
|
||||
_tranNodes = new Map();
|
||||
@@ -187,11 +102,6 @@ export class Translator {
|
||||
if (rule.transOpen === "true") {
|
||||
this._register();
|
||||
}
|
||||
|
||||
this._inputRule = setting.inputRule || DEFAULT_INPUT_RULE;
|
||||
if (this._inputRule.transOpen) {
|
||||
this._registerInput();
|
||||
}
|
||||
}
|
||||
|
||||
get setting() {
|
||||
@@ -355,125 +265,6 @@ export class Translator {
|
||||
}
|
||||
};
|
||||
|
||||
_registerInput = () => {
|
||||
const {
|
||||
triggerShortcut: initTriggerShortcut,
|
||||
translator,
|
||||
fromLang,
|
||||
toLang: initToLang,
|
||||
triggerCount: initTriggerCount,
|
||||
triggerTime,
|
||||
transSign,
|
||||
} = this._inputRule;
|
||||
const apiSetting =
|
||||
this._setting.transApis?.[translator] || DEFAULT_TRANS_APIS[translator];
|
||||
const { detectRemote } = this._setting;
|
||||
|
||||
let triggerShortcut = initTriggerShortcut;
|
||||
let triggerCount = initTriggerCount;
|
||||
if (triggerShortcut.length === 0) {
|
||||
triggerShortcut = DEFAULT_INPUT_SHORTCUT;
|
||||
triggerCount = 1;
|
||||
}
|
||||
|
||||
stepShortcutRegister(
|
||||
triggerShortcut,
|
||||
async () => {
|
||||
let node = document.activeElement;
|
||||
|
||||
if (!node) {
|
||||
return;
|
||||
}
|
||||
|
||||
while (node.shadowRoot) {
|
||||
node = node.shadowRoot.activeElement;
|
||||
}
|
||||
|
||||
if (!isInputNode(node) && !isEditAbleNode(node)) {
|
||||
return;
|
||||
}
|
||||
|
||||
let initText = getNodeText(node);
|
||||
if (triggerShortcut.length === 1 && triggerShortcut[0].length === 1) {
|
||||
// todo: remove multiple char
|
||||
initText = removeEndchar(initText, triggerShortcut[0], triggerCount);
|
||||
}
|
||||
if (!initText.trim()) {
|
||||
return;
|
||||
}
|
||||
|
||||
let text = initText;
|
||||
let toLang = initToLang;
|
||||
if (transSign) {
|
||||
const res = matchInputStr(text, transSign);
|
||||
if (res) {
|
||||
let lang = res[1];
|
||||
if (lang === "zh" || lang === "cn") {
|
||||
lang = "zh-CN";
|
||||
} else if (lang === "tw" || lang === "hk") {
|
||||
lang = "zh-TW";
|
||||
}
|
||||
if (lang && OPT_LANGS_LIST.includes(lang)) {
|
||||
toLang = lang;
|
||||
}
|
||||
text = res[2];
|
||||
}
|
||||
}
|
||||
|
||||
// console.log("input -->", text);
|
||||
|
||||
const loadingId = "kiss-" + genEventName();
|
||||
try {
|
||||
addLoading(node, loadingId);
|
||||
|
||||
const deLang = await tryDetectLang(text, detectRemote);
|
||||
if (deLang && toLang.includes(deLang)) {
|
||||
return;
|
||||
}
|
||||
|
||||
const [trText, isSame] = await apiTranslate({
|
||||
translator,
|
||||
text,
|
||||
fromLang,
|
||||
toLang,
|
||||
apiSetting,
|
||||
});
|
||||
if (!trText || isSame) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (isInputNode(node)) {
|
||||
node.value = trText;
|
||||
node.dispatchEvent(
|
||||
new Event("input", { bubbles: true, cancelable: true })
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
selectContent(node);
|
||||
await sleep(200);
|
||||
|
||||
pasteContentEvent(node, trText);
|
||||
await sleep(200);
|
||||
|
||||
// todo: use includes?
|
||||
if (getNodeText(node).startsWith(initText)) {
|
||||
pasteContentCommand(node, trText);
|
||||
await sleep(100);
|
||||
} else {
|
||||
collapseToEnd(node);
|
||||
}
|
||||
} catch (err) {
|
||||
console.log("[translate input]", err.message);
|
||||
} finally {
|
||||
removeLoading(node, loadingId);
|
||||
}
|
||||
},
|
||||
triggerCount,
|
||||
triggerTime
|
||||
);
|
||||
};
|
||||
|
||||
_handleMouseover = (e) => {
|
||||
// console.log("mouseenter", e);
|
||||
if (!this._tranNodes.has(e.target)) {
|
||||
|
||||
@@ -1,82 +1,3 @@
|
||||
import { getSettingWithDefault } from "./libs/storage";
|
||||
import { trySyncAllSubRules } from "./libs/subRules";
|
||||
import { isIframe } from "./libs/iframe";
|
||||
import { handlePing, injectScript } from "./libs/gm";
|
||||
import { genEventName } from "./libs/utils";
|
||||
import { runWebfix } from "./libs/webfix";
|
||||
import {
|
||||
runIframe,
|
||||
runTranslator,
|
||||
showFab,
|
||||
showTransbox,
|
||||
windowListener,
|
||||
showErr,
|
||||
touchOperation,
|
||||
} from "./common";
|
||||
import { run } from "./common";
|
||||
|
||||
function runSettingPage() {
|
||||
if (GM?.info?.script?.grant?.includes("unsafeWindow")) {
|
||||
unsafeWindow.GM = GM;
|
||||
unsafeWindow.APP_INFO = {
|
||||
name: process.env.REACT_APP_NAME,
|
||||
version: process.env.REACT_APP_VERSION,
|
||||
};
|
||||
} else {
|
||||
const ping = genEventName();
|
||||
window.addEventListener(ping, handlePing);
|
||||
// window.eval(`(${injectScript})("${ping}")`); // eslint-disable-line
|
||||
const script = document.createElement("script");
|
||||
script.textContent = `(${injectScript})("${ping}")`;
|
||||
document.head.append(script);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 入口函数
|
||||
*/
|
||||
(async () => {
|
||||
try {
|
||||
// 设置页面
|
||||
if (
|
||||
document.location.href.includes(process.env.REACT_APP_OPTIONSPAGE_DEV) ||
|
||||
document.location.href.includes(process.env.REACT_APP_OPTIONSPAGE) ||
|
||||
document.location.href.includes(process.env.REACT_APP_OPTIONSPAGE2)
|
||||
) {
|
||||
runSettingPage();
|
||||
return;
|
||||
}
|
||||
|
||||
// 读取设置信息
|
||||
const setting = await getSettingWithDefault();
|
||||
|
||||
// 适配iframe
|
||||
if (isIframe) {
|
||||
runIframe(setting);
|
||||
return;
|
||||
}
|
||||
|
||||
// 不规范网页修复
|
||||
await runWebfix(setting);
|
||||
|
||||
// 翻译网页
|
||||
const { translator, rule } = await runTranslator(setting);
|
||||
|
||||
// 监听消息
|
||||
windowListener(rule);
|
||||
|
||||
// 划词翻译
|
||||
showTransbox(setting);
|
||||
|
||||
// 浮球按钮
|
||||
await showFab(translator);
|
||||
|
||||
// 触屏操作
|
||||
touchOperation(translator);
|
||||
|
||||
// 同步订阅规则
|
||||
await trySyncAllSubRules(setting);
|
||||
} catch (err) {
|
||||
console.error("[KISS-Translator]", err);
|
||||
showErr(err.message);
|
||||
}
|
||||
})();
|
||||
run(true);
|
||||
|
||||
@@ -95,6 +95,8 @@ export default function Action({ translator, fab }) {
|
||||
// 注册菜单
|
||||
try {
|
||||
const menuCommandIds = [];
|
||||
const { contextMenus = true } = translator.setting;
|
||||
contextMenus &&
|
||||
menuCommandIds.push(
|
||||
GM.registerMenuCommand(
|
||||
"Toggle Translate (Alt+q)",
|
||||
@@ -215,7 +217,12 @@ export default function Action({ translator, fab }) {
|
||||
}
|
||||
}}
|
||||
>
|
||||
<TranslateIcon />
|
||||
<TranslateIcon
|
||||
sx={{
|
||||
width: 24,
|
||||
height: 24,
|
||||
}}
|
||||
/>
|
||||
</Fab>
|
||||
}
|
||||
/>
|
||||
|
||||
@@ -7,6 +7,7 @@ import {
|
||||
OPT_STYLE_WAVYLINE,
|
||||
OPT_STYLE_FUZZY,
|
||||
OPT_STYLE_HIGHLIGHT,
|
||||
OPT_STYLE_BLOCKQUOTE,
|
||||
OPT_STYLE_DIY,
|
||||
DEFAULT_COLOR,
|
||||
MSG_TRANS_CURRULE,
|
||||
@@ -34,6 +35,18 @@ const LineSpan = styled("span")`
|
||||
}
|
||||
`;
|
||||
|
||||
const BlockquoteSpan = styled("span")`
|
||||
opacity: 0.6;
|
||||
-webkit-opacity: 0.6;
|
||||
display: block;
|
||||
padding: 0 0.75em;
|
||||
border-left: 0.25em solid ${(props) => props.$lineColor};
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
-webkit-opacity: 1;
|
||||
}
|
||||
`;
|
||||
|
||||
const FuzzySpan = styled("span")`
|
||||
filter: blur(0.2em);
|
||||
-webkit-filter: blur(0.2em);
|
||||
@@ -86,6 +99,12 @@ function StyledSpan({ textStyle, textDiyStyle, bgColor, children }) {
|
||||
{children}
|
||||
</HighlightSpan>
|
||||
);
|
||||
case OPT_STYLE_BLOCKQUOTE: // 引用
|
||||
return (
|
||||
<BlockquoteSpan $lineColor={bgColor || DEFAULT_COLOR}>
|
||||
{children}
|
||||
</BlockquoteSpan>
|
||||
);
|
||||
case OPT_STYLE_DIY: // 自定义
|
||||
return <DiySpan $diyStyle={textDiyStyle}>{children}</DiySpan>;
|
||||
default:
|
||||
|
||||
@@ -9,6 +9,7 @@ import {
|
||||
OPT_TRANS_BAIDU,
|
||||
OPT_TRANS_TENCENT,
|
||||
OPT_TRANS_OPENAI,
|
||||
OPT_TRANS_GEMINI,
|
||||
OPT_TRANS_CUSTOMIZE,
|
||||
URL_KISS_PROXY,
|
||||
} from "../../config";
|
||||
@@ -115,7 +116,7 @@ function ApiFields({ translator }) {
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
{translator === OPT_TRANS_OPENAI && (
|
||||
{(translator === OPT_TRANS_OPENAI || translator === OPT_TRANS_GEMINI) && (
|
||||
<>
|
||||
<TextField
|
||||
size="small"
|
||||
|
||||
@@ -23,10 +23,14 @@ import {
|
||||
OPT_SHORTCUT_STYLE,
|
||||
OPT_SHORTCUT_POPUP,
|
||||
OPT_SHORTCUT_SETTING,
|
||||
OPT_LANGS_TO,
|
||||
DEFAULT_BLACKLIST,
|
||||
MSG_CONTEXT_MENUS,
|
||||
} from "../../config";
|
||||
import { useShortcut } from "../../hooks/Shortcut";
|
||||
import ShortcutInput from "./ShortcutInput";
|
||||
import { useFab } from "../../hooks/Fab";
|
||||
import { sendBgMsg } from "../../libs/msg";
|
||||
|
||||
function ShortcutItem({ action, label }) {
|
||||
const { shortcut, setShortcut } = useShortcut(action);
|
||||
@@ -61,7 +65,10 @@ export default function Settings() {
|
||||
value = limitNumber(value, 1, 1000);
|
||||
break;
|
||||
case "touchTranslate":
|
||||
value = limitNumber(value, 0, 3);
|
||||
value = limitNumber(value, 0, 4);
|
||||
break;
|
||||
case "contextMenus":
|
||||
isExt && sendBgMsg(MSG_CONTEXT_MENUS, { contextMenus: value });
|
||||
break;
|
||||
default:
|
||||
}
|
||||
@@ -89,7 +96,10 @@ export default function Settings() {
|
||||
newlineLength = TRANS_NEWLINE_LENGTH,
|
||||
mouseKey = OPT_MOUSEKEY_DISABLE,
|
||||
detectRemote = false,
|
||||
contextMenus = true,
|
||||
touchTranslate = 2,
|
||||
blacklist = DEFAULT_BLACKLIST.join(",\n"),
|
||||
disableLangs = [],
|
||||
} = setting;
|
||||
const { isHide = false } = fab || {};
|
||||
|
||||
@@ -204,6 +214,19 @@ export default function Settings() {
|
||||
</Select>
|
||||
</FormControl>
|
||||
|
||||
<FormControl size="small">
|
||||
<InputLabel>{i18n("add_context_menus")}</InputLabel>
|
||||
<Select
|
||||
name="contextMenus"
|
||||
value={contextMenus}
|
||||
label={i18n("add_context_menus")}
|
||||
onChange={handleChange}
|
||||
>
|
||||
<MenuItem value={false}>{i18n("disable")}</MenuItem>
|
||||
<MenuItem value={true}>{i18n("enable")}</MenuItem>
|
||||
</Select>
|
||||
</FormControl>
|
||||
|
||||
<FormControl size="small">
|
||||
<InputLabel>{i18n("detect_lang_remote")}</InputLabel>
|
||||
<Select
|
||||
@@ -218,7 +241,26 @@ export default function Settings() {
|
||||
<FormHelperText>{i18n("detect_lang_remote_help")}</FormHelperText>
|
||||
</FormControl>
|
||||
|
||||
<FormControl size="small">
|
||||
<InputLabel>{i18n("disable_langs")}</InputLabel>
|
||||
<Select
|
||||
multiple
|
||||
name="disableLangs"
|
||||
value={disableLangs}
|
||||
label={i18n("disable_langs")}
|
||||
onChange={handleChange}
|
||||
>
|
||||
{OPT_LANGS_TO.map(([langKey, langName]) => (
|
||||
<MenuItem key={langKey} value={langKey}>
|
||||
{langName}
|
||||
</MenuItem>
|
||||
))}
|
||||
</Select>
|
||||
<FormHelperText>{i18n("disable_langs_helper")}</FormHelperText>
|
||||
</FormControl>
|
||||
|
||||
{isExt ? (
|
||||
<>
|
||||
<FormControl size="small">
|
||||
<InputLabel>{i18n("if_clear_cache")}</InputLabel>
|
||||
<Select
|
||||
@@ -236,6 +278,7 @@ export default function Settings() {
|
||||
</Link>
|
||||
</FormHelperText>
|
||||
</FormControl>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<Box>
|
||||
@@ -268,6 +311,16 @@ export default function Settings() {
|
||||
</Box>
|
||||
</>
|
||||
)}
|
||||
|
||||
<TextField
|
||||
size="small"
|
||||
label={i18n("translate_blacklist")}
|
||||
helperText={i18n("pattern_helper")}
|
||||
name="blacklist"
|
||||
defaultValue={blacklist}
|
||||
onChange={handleChange}
|
||||
multiline
|
||||
/>
|
||||
</Stack>
|
||||
</Box>
|
||||
);
|
||||
|
||||
@@ -3,12 +3,7 @@ import Stack from "@mui/material/Stack";
|
||||
import TextField from "@mui/material/TextField";
|
||||
import MenuItem from "@mui/material/MenuItem";
|
||||
import { useI18n } from "../../hooks/I18n";
|
||||
import {
|
||||
OPT_TRANS_ALL,
|
||||
OPT_LANGS_FROM,
|
||||
OPT_LANGS_TO,
|
||||
DEFAULT_TRANSEL_SHORTCUT,
|
||||
} from "../../config";
|
||||
import { OPT_TRANS_ALL, OPT_LANGS_FROM, OPT_LANGS_TO } from "../../config";
|
||||
import ShortcutInput from "./ShortcutInput";
|
||||
import FormControlLabel from "@mui/material/FormControlLabel";
|
||||
import Switch from "@mui/material/Switch";
|
||||
@@ -44,20 +39,13 @@ export default function Tranbox() {
|
||||
[updateTranbox]
|
||||
);
|
||||
|
||||
const handleShortcutTransel = useCallback(
|
||||
(val) => {
|
||||
updateTranbox({ transelShortcut: val });
|
||||
},
|
||||
[updateTranbox]
|
||||
);
|
||||
|
||||
const {
|
||||
transOpen,
|
||||
translator,
|
||||
fromLang,
|
||||
toLang,
|
||||
toLang2 = "en",
|
||||
tranboxShortcut,
|
||||
transelShortcut = DEFAULT_TRANSEL_SHORTCUT,
|
||||
btnOffsetX,
|
||||
btnOffsetY,
|
||||
hideTranBtn = false,
|
||||
@@ -125,6 +113,22 @@ export default function Tranbox() {
|
||||
))}
|
||||
</TextField>
|
||||
|
||||
<TextField
|
||||
select
|
||||
size="small"
|
||||
name="toLang2"
|
||||
value={toLang2}
|
||||
label={i18n("to_lang2")}
|
||||
helperText={i18n("to_lang2_helper")}
|
||||
onChange={handleChange}
|
||||
>
|
||||
{[["none", "None"], ...OPT_LANGS_TO].map(([lang, name]) => (
|
||||
<MenuItem key={lang} value={lang}>
|
||||
{name}
|
||||
</MenuItem>
|
||||
))}
|
||||
</TextField>
|
||||
|
||||
<TextField
|
||||
size="small"
|
||||
label={i18n("tranbtn_offset_x")}
|
||||
@@ -160,12 +164,6 @@ export default function Tranbox() {
|
||||
onChange={handleShortcutInput}
|
||||
label={i18n("trigger_tranbox_shortcut")}
|
||||
/>
|
||||
|
||||
<ShortcutInput
|
||||
value={transelShortcut}
|
||||
onChange={handleShortcutTransel}
|
||||
label={i18n("trigger_transel_shortcut")}
|
||||
/>
|
||||
</Stack>
|
||||
</Box>
|
||||
);
|
||||
|
||||
@@ -5,9 +5,9 @@ import { useState } from "react";
|
||||
|
||||
export default function CopyBtn({ text }) {
|
||||
const [copied, setCopied] = useState(false);
|
||||
const handleClick = (e) => {
|
||||
const handleClick = async (e) => {
|
||||
e.stopPropagation();
|
||||
navigator.clipboard.writeText(text);
|
||||
await navigator.clipboard.writeText(text);
|
||||
setCopied(true);
|
||||
const timer = setTimeout(() => {
|
||||
clearTimeout(timer);
|
||||
|
||||
@@ -24,6 +24,7 @@ function TranForm({ text, setText, tranboxSetting, transApis }) {
|
||||
const [translator, setTranslator] = useState(tranboxSetting.translator);
|
||||
const [fromLang, setFromLang] = useState(tranboxSetting.fromLang);
|
||||
const [toLang, setToLang] = useState(tranboxSetting.toLang);
|
||||
const [toLang2, setToLang2] = useState(tranboxSetting.toLang2);
|
||||
const inputRef = useRef(null);
|
||||
|
||||
return (
|
||||
@@ -150,6 +151,9 @@ function TranForm({ text, setText, tranboxSetting, transApis }) {
|
||||
translator={translator}
|
||||
fromLang={fromLang}
|
||||
toLang={toLang}
|
||||
toLang2={toLang2}
|
||||
setToLang={setToLang}
|
||||
setToLang2={setToLang2}
|
||||
transApis={transApis}
|
||||
/>
|
||||
</Stack>
|
||||
|
||||
@@ -3,7 +3,7 @@ export default function TranBtn({ onClick, position, tranboxSetting }) {
|
||||
<div
|
||||
style={{
|
||||
cursor: "pointer",
|
||||
position: "fixed",
|
||||
position: "absolute",
|
||||
left: position.x + tranboxSetting.btnOffsetX,
|
||||
top: position.y + tranboxSetting.btnOffsetY,
|
||||
zIndex: 2147483647,
|
||||
|
||||
@@ -6,7 +6,7 @@ import Stack from "@mui/material/Stack";
|
||||
import { useI18n } from "../../hooks/I18n";
|
||||
import { DEFAULT_TRANS_APIS, OPT_TRANS_BAIDU } from "../../config";
|
||||
import { useEffect, useState } from "react";
|
||||
import { apiTranslate } from "../../apis";
|
||||
import { apiTranslate, apiBaiduLangdetect } from "../../apis";
|
||||
import { isValidWord } from "../../libs/utils";
|
||||
import CopyBtn from "./CopyBtn";
|
||||
import DictCont from "./DictCont";
|
||||
@@ -16,6 +16,9 @@ export default function TranCont({
|
||||
translator,
|
||||
fromLang,
|
||||
toLang,
|
||||
toLang2 = "en",
|
||||
setToLang,
|
||||
setToLang2,
|
||||
transApis,
|
||||
}) {
|
||||
const i18n = useI18n();
|
||||
@@ -32,6 +35,16 @@ export default function TranCont({
|
||||
setError("");
|
||||
setDictResult(null);
|
||||
|
||||
// 互译
|
||||
if (toLang !== toLang2 && toLang2 !== "none") {
|
||||
const detectLang = await apiBaiduLangdetect(text);
|
||||
if (detectLang === toLang) {
|
||||
setToLang(toLang2);
|
||||
setToLang2(toLang);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
const apiSetting =
|
||||
transApis[translator] || DEFAULT_TRANS_APIS[translator];
|
||||
const tranRes = await apiTranslate({
|
||||
@@ -63,7 +76,16 @@ export default function TranCont({
|
||||
setLoading(false);
|
||||
}
|
||||
})();
|
||||
}, [text, translator, fromLang, toLang, transApis]);
|
||||
}, [
|
||||
text,
|
||||
translator,
|
||||
fromLang,
|
||||
toLang,
|
||||
toLang2,
|
||||
setToLang,
|
||||
setToLang2,
|
||||
transApis,
|
||||
]);
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
@@ -4,13 +4,9 @@ import TranBox from "./TranBox";
|
||||
import { shortcutRegister } from "../../libs/shortcut";
|
||||
import { sleep } from "../../libs/utils";
|
||||
import { isGm } from "../../libs/client";
|
||||
import {
|
||||
MSG_TRANSLATE_SELECTED,
|
||||
MSG_OPEN_TRANBOX,
|
||||
DEFAULT_TRANSEL_SHORTCUT,
|
||||
} from "../../config";
|
||||
import { MSG_OPEN_TRANBOX, DEFAULT_TRANBOX_SHORTCUT } from "../../config";
|
||||
|
||||
export default function Slection({ tranboxSetting, transApis }) {
|
||||
export default function Slection({ contextMenus, tranboxSetting, transApis }) {
|
||||
const [showBox, setShowBox] = useState(false);
|
||||
const [showBtn, setShowBtn] = useState(false);
|
||||
const [selectedText, setSelText] = useState("");
|
||||
@@ -30,11 +26,12 @@ export default function Slection({ tranboxSetting, transApis }) {
|
||||
setShowBox(true);
|
||||
};
|
||||
|
||||
const handleTranSelected = useCallback(() => {
|
||||
const handleTranbox = useCallback(() => {
|
||||
setShowBtn(false);
|
||||
|
||||
const selectedText = window.getSelection()?.toString()?.trim() || "";
|
||||
if (!selectedText) {
|
||||
setShowBox((pre) => !pre);
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -55,7 +52,8 @@ export default function Slection({ tranboxSetting, transApis }) {
|
||||
}
|
||||
|
||||
!tranboxSetting.hideTranBtn && setShowBtn(true);
|
||||
setPosition({ x: e.clientX, y: e.clientY });
|
||||
// setPosition({ x: e.clientX, y: e.clientY });
|
||||
setPosition({ x: e.pageX, y: e.pageY });
|
||||
}
|
||||
|
||||
window.addEventListener("mouseup", handleMouseup);
|
||||
@@ -66,44 +64,21 @@ export default function Slection({ tranboxSetting, transApis }) {
|
||||
|
||||
useEffect(() => {
|
||||
const clearShortcut = shortcutRegister(
|
||||
tranboxSetting.tranboxShortcut,
|
||||
() => {
|
||||
setShowBox((pre) => !pre);
|
||||
}
|
||||
tranboxSetting.tranboxShortcut || DEFAULT_TRANBOX_SHORTCUT,
|
||||
handleTranbox
|
||||
);
|
||||
|
||||
return () => {
|
||||
clearShortcut();
|
||||
};
|
||||
}, [tranboxSetting.tranboxShortcut]);
|
||||
}, [tranboxSetting.tranboxShortcut, handleTranbox]);
|
||||
|
||||
useEffect(() => {
|
||||
const clearShortcut = shortcutRegister(
|
||||
tranboxSetting.transelShortcut || DEFAULT_TRANSEL_SHORTCUT,
|
||||
handleTranSelected
|
||||
);
|
||||
|
||||
window.addEventListener(MSG_OPEN_TRANBOX, handleTranbox);
|
||||
return () => {
|
||||
clearShortcut();
|
||||
window.removeEventListener(MSG_OPEN_TRANBOX, handleTranbox);
|
||||
};
|
||||
}, [tranboxSetting.transelShortcut, handleTranSelected]);
|
||||
|
||||
useEffect(() => {
|
||||
window.addEventListener(MSG_TRANSLATE_SELECTED, handleTranSelected);
|
||||
return () => {
|
||||
window.removeEventListener(MSG_TRANSLATE_SELECTED, handleTranSelected);
|
||||
};
|
||||
}, [handleTranSelected]);
|
||||
|
||||
useEffect(() => {
|
||||
const handleOpenTranbox = () => {
|
||||
setShowBox((pre) => !pre);
|
||||
};
|
||||
window.addEventListener(MSG_OPEN_TRANBOX, handleOpenTranbox);
|
||||
return () => {
|
||||
window.removeEventListener(MSG_OPEN_TRANBOX, handleOpenTranbox);
|
||||
};
|
||||
}, []);
|
||||
}, [handleTranbox]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!isGm) {
|
||||
@@ -113,20 +88,14 @@ export default function Slection({ tranboxSetting, transApis }) {
|
||||
// 注册菜单
|
||||
try {
|
||||
const menuCommandIds = [];
|
||||
contextMenus &&
|
||||
menuCommandIds.push(
|
||||
GM.registerMenuCommand(
|
||||
"Translate Selected Text (Alt+S)",
|
||||
(event) => {
|
||||
handleTranSelected();
|
||||
handleTranbox();
|
||||
},
|
||||
"S"
|
||||
),
|
||||
GM.registerMenuCommand(
|
||||
"Open Translate Popup (Alt+B)",
|
||||
(event) => {
|
||||
setShowBox((pre) => !pre);
|
||||
},
|
||||
"B"
|
||||
)
|
||||
);
|
||||
|
||||
@@ -138,7 +107,7 @@ export default function Slection({ tranboxSetting, transApis }) {
|
||||
} catch (err) {
|
||||
console.log("[registerMenuCommand]", err);
|
||||
}
|
||||
}, [handleTranSelected]);
|
||||
}, [handleTranbox, contextMenus]);
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
Reference in New Issue
Block a user