Compare commits

..

10 Commits

Author SHA1 Message Date
Gabe Yuan
9703514698 v1.8.8 2024-04-21 19:25:00 +08:00
Gabe Yuan
de7a97fb76 feat: tranbox offset 2024-04-21 19:19:06 +08:00
Gabe Yuan
319aaf8132 fix: move taskpool from background to content 2024-04-21 13:16:44 +08:00
Gabe Yuan
74bc58ba91 feat: transbox follow selection 2024-04-20 18:07:16 +08:00
Gabe Yuan
d622db0d7c fix: i18n menu command for userscript 2024-04-20 15:54:41 +08:00
Gabe Yuan
de1ddf2362 fix: stopPropagation when close tranbox 2024-04-20 15:12:25 +08:00
Gabe Yuan
32c0fc860b fix: update readme 2024-04-20 14:11:32 +08:00
Gabe Yuan
1938f432dd feat: support multi url for DEEPLX 2024-04-20 14:01:34 +08:00
Gabe Yuan
a5cfb0ca1d fix: fetch pool retry 2024-04-20 11:52:16 +08:00
Gabe Yuan
a172234fb0 fix: niutrans i18n text 2024-04-18 12:31:16 +08:00
24 changed files with 387 additions and 437 deletions

2
.env
View File

@@ -2,7 +2,7 @@ GENERATE_SOURCEMAP=false
REACT_APP_NAME=KISS Translator
REACT_APP_NAME_CN=简约翻译
REACT_APP_VERSION=1.8.7
REACT_APP_VERSION=1.8.8
REACT_APP_HOMEPAGE=https://github.com/fishjar/kiss-translator

View File

@@ -12,7 +12,7 @@ A simple, open source [bilingual translation extension & Greasemonkey script](ht
- [x] Chrome/Edge/Firefox/Kiwi/Orion
- [ ] Safari
- [x] Supports multiple translation services
- [x] Google/Microsoft/DeepL/OpenAI/Gemini/CloudflareAI/Baidu/Tencent
- [x] Google/Microsoft/DeepL/NiuTrans/OpenAI/Gemini/CloudflareAI/Baidu/Tencent
- [x] Custom translation interface
- [x] Covers common translation scenarios
- [x] Web bilingual translation

View File

@@ -12,7 +12,7 @@
- [x] Chrome/Edge/Firefox/Kiwi/Orion
- [ ] Safari
- [x] 支持多种翻译服务
- [x] Google/Microsoft/DeepL/OpenAI/Gemini/CloudflareAI/Baidu/Tencent
- [x] Google/Microsoft/DeepL/NiuTrans/OpenAI/Gemini/CloudflareAI/Baidu/Tencent
- [x] 自定义翻译接口
- [x] 覆盖常见翻译场景
- [x] 网页双语对照翻译

View File

@@ -1,7 +1,7 @@
{
"name": "kiss-translator",
"description": "A minimalist bilingual translation Extension & Greasemonkey Script",
"version": "1.8.7",
"version": "1.8.8",
"author": "Gabe<yugang2002@gmail.com>",
"private": true,
"dependencies": {

View File

@@ -2,7 +2,7 @@
"manifest_version": 2,
"name": "__MSG_app_name__",
"description": "__MSG_app_description__",
"version": "1.8.7",
"version": "1.8.8",
"default_locale": "en",
"author": "Gabe<yugang2002@gmail.com>",
"homepage_url": "https://github.com/fishjar/kiss-translator",

View File

@@ -2,7 +2,7 @@
"manifest_version": 3,
"name": "__MSG_app_name__",
"description": "__MSG_app_description__",
"version": "1.8.7",
"version": "1.8.8",
"default_locale": "en",
"author": "Gabe<yugang2002@gmail.com>",
"homepage_url": "https://github.com/fishjar/kiss-translator",

View File

@@ -1,243 +1,5 @@
import queryString from "query-string";
import { getBdauth, setBdauth } from "../libs/storage";
import {
URL_BAIDU_WEB,
URL_BAIDU_TRANSAPI_V2,
URL_BAIDU_TRANSAPI,
DEFAULT_USER_AGENT,
} from "../config";
import { fetchApi } from "../libs/fetch";
/* eslint-disable */
function n(t, e) {
for (var n = 0; n < e.length - 2; n += 3) {
var r = e.charAt(n + 2);
(r = "a" <= r ? r.charCodeAt(0) - 87 : Number(r)),
(r = "+" === e.charAt(n + 1) ? t >>> r : t << r),
(t = "+" === e.charAt(n) ? (t + r) & 4294967295 : t ^ r);
}
return t;
}
function e(t, e) {
(null == e || e > t.length) && (e = t.length);
for (var n = 0, r = new Array(e); n < e; n++) r[n] = t[n];
return r;
}
/* eslint-disable */
function getSign(t, gtk, r = null) {
var o,
i = t.match(/[\uD800-\uDBFF][\uDC00-\uDFFF]/g);
if (null === i) {
var a = t.length;
a > 30 &&
(t = ""
.concat(t.substr(0, 10))
.concat(t.substr(Math.floor(a / 2) - 5, 10))
.concat(t.substr(-10, 10)));
} else {
for (
var s = t.split(/[\uD800-\uDBFF][\uDC00-\uDFFF]/),
c = 0,
u = s.length,
l = [];
c < u;
c++
)
"" !== s[c] &&
l.push.apply(
l,
(function (t) {
if (Array.isArray(t)) return e(t);
})((o = s[c].split(""))) ||
(function (t) {
if (
("undefined" != typeof Symbol && null != t[Symbol.iterator]) ||
null != t["@@iterator"]
)
return Array.from(t);
})(o) ||
(function (t, n) {
if (t) {
if ("string" == typeof t) return e(t, n);
var r = Object.prototype.toString.call(t).slice(8, -1);
return (
"Object" === r && t.constructor && (r = t.constructor.name),
"Map" === r || "Set" === r
? Array.from(t)
: "Arguments" === r ||
/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)
? e(t, n)
: void 0
);
}
})(o) ||
(function () {
throw new TypeError(
"Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."
);
})()
),
c !== u - 1 && l.push(i[c]);
var p = l.length;
p > 30 &&
(t =
l.slice(0, 10).join("") +
l.slice(Math.floor(p / 2) - 5, Math.floor(p / 2) + 5).join("") +
l.slice(-10).join(""));
}
for (
var d = ""
.concat(String.fromCharCode(103))
.concat(String.fromCharCode(116))
.concat(String.fromCharCode(107)),
h = (null !== r ? r : (r = gtk || "") || "").split("."),
f = Number(h[0]) || 0,
m = Number(h[1]) || 0,
g = [],
y = 0,
v = 0;
v < t.length;
v++
) {
var _ = t.charCodeAt(v);
_ < 128
? (g[y++] = _)
: (_ < 2048
? (g[y++] = (_ >> 6) | 192)
: (55296 == (64512 & _) &&
v + 1 < t.length &&
56320 == (64512 & t.charCodeAt(v + 1))
? ((_ = 65536 + ((1023 & _) << 10) + (1023 & t.charCodeAt(++v))),
(g[y++] = (_ >> 18) | 240),
(g[y++] = ((_ >> 12) & 63) | 128))
: (g[y++] = (_ >> 12) | 224),
(g[y++] = ((_ >> 6) & 63) | 128)),
(g[y++] = (63 & _) | 128));
}
for (
var b = f,
w =
""
.concat(String.fromCharCode(43))
.concat(String.fromCharCode(45))
.concat(String.fromCharCode(97)) +
""
.concat(String.fromCharCode(94))
.concat(String.fromCharCode(43))
.concat(String.fromCharCode(54)),
k =
""
.concat(String.fromCharCode(43))
.concat(String.fromCharCode(45))
.concat(String.fromCharCode(51)) +
""
.concat(String.fromCharCode(94))
.concat(String.fromCharCode(43))
.concat(String.fromCharCode(98)) +
""
.concat(String.fromCharCode(43))
.concat(String.fromCharCode(45))
.concat(String.fromCharCode(102)),
x = 0;
x < g.length;
x++
)
b = n((b += g[x]), w);
return (
(b = n(b, k)),
(b ^= m) < 0 && (b = 2147483648 + (2147483647 & b)),
"".concat((b %= 1e6).toString(), ".").concat(b ^ f)
);
}
const getToken = async () => {
const res = await fetchApi({
input: URL_BAIDU_WEB,
init: {
headers: {
"Content-type": "text/html; charset=utf-8",
},
},
});
if (!res.ok) {
throw new Error(res.statusText);
}
const text = await res.text();
const token = text.match(/token: '(.*)',/)[1];
const gtk = text.match(/gtk = "(.*)";/)[1];
const exp = Date.now() + 8 * 60 * 60 * 1000;
if (!token || !gtk) {
throw new Error("[baidu] get token error");
}
return { token, gtk, exp };
};
/**
* 闭包缓存token减少对storage查询
* @returns
*/
const _bdAuth = () => {
let store;
return async () => {
const now = Date.now();
// 查询内存缓存
if (store && store.exp > now) {
return store;
}
// 查询storage缓存
store = await getBdauth();
if (store && store.exp > now) {
return store;
}
// 缓存没有或失效,查询接口
store = await getToken();
await setBdauth(store);
return store;
};
};
const bdAuth = _bdAuth();
/**
* 失效作废
* @param {*} param0
* @returns
*/
export const genBaiduV2 = async ({ text, from, to }) => {
const { token, gtk } = await bdAuth();
const sign = getSign(text, gtk);
const data = {
from,
to,
query: text,
simple_means_flag: 3,
sign,
token,
domain: "common",
ts: Date.now(),
};
const input = `${URL_BAIDU_TRANSAPI_V2}?from=${from}&to=${to}`;
const init = {
headers: {
"content-type": "application/x-www-form-urlencoded; charset=UTF-8",
},
method: "POST",
body: queryString.stringify(data),
};
return [input, init];
};
import { URL_BAIDU_TRANSAPI, DEFAULT_USER_AGENT } from "../config";
export const genBaidu = async ({ text, from, to }) => {
const data = {

View File

@@ -1,5 +1,5 @@
import queryString from "query-string";
import { fetchPolyfill } from "../libs/fetch";
import { fetchData } from "../libs/fetch";
import {
OPT_TRANS_GOOGLE,
OPT_TRANS_MICROSOFT,
@@ -37,7 +37,7 @@ import { sha256 } from "../libs/utils";
* @returns
*/
export const apiSyncData = async (url, key, data) =>
fetchPolyfill(url, {
fetchData(url, {
headers: {
"Content-type": "application/json",
Authorization: `Bearer ${await sha256(key, KV_SALT_SYNC)}`,
@@ -51,7 +51,7 @@ export const apiSyncData = async (url, key, data) =>
* @param {*} url
* @returns
*/
export const apiFetch = (url) => fetchPolyfill(url);
export const apiFetch = (url) => fetchData(url);
/**
* 百度语言识别
@@ -59,7 +59,7 @@ export const apiFetch = (url) => fetchPolyfill(url);
* @returns
*/
export const apiBaiduLangdetect = async (text) => {
const res = await fetchPolyfill(URL_BAIDU_LANGDETECT, {
const res = await fetchData(URL_BAIDU_LANGDETECT, {
headers: {
"Content-type": "application/json",
},
@@ -83,7 +83,7 @@ export const apiBaiduLangdetect = async (text) => {
* @returns
*/
export const apiBaiduSuggest = async (text) => {
const res = await fetchPolyfill(URL_BAIDU_SUGGEST, {
const res = await fetchData(URL_BAIDU_SUGGEST, {
headers: {
"Content-type": "application/json",
},
@@ -110,7 +110,7 @@ export const apiBaiduSuggest = async (text) => {
*/
export const apiBaiduTTS = (text, lan = "uk", spd = 3) => {
const url = `${URL_BAIDU_TTS}?${queryString.stringify({ lan, text, spd })}`;
return fetchPolyfill(url, {
return fetchData(url, {
useCache: false, // 为避免缓存过快增长,禁用缓存语音数据
});
};
@@ -128,7 +128,7 @@ export const apiTencentLangdetect = async (text) => {
text,
});
const res = await fetchPolyfill(URL_TENCENT_TRANSMART, {
const res = await fetchData(URL_TENCENT_TRANSMART, {
headers: {
"Content-type": "application/json",
},
@@ -187,7 +187,7 @@ export const apiTranslate = async ({
to,
};
const res = await fetchPolyfill(
const res = await fetchData(
`${URL_CACHE_TRAN}?${queryString.stringify(cacheOpts)}`,
{
useCache,

View File

@@ -24,14 +24,15 @@ import {
INPUT_PLACE_TEXT,
INPUT_PLACE_KEY,
} from "../config";
import { msAuth } from "./auth";
import { genDeeplFree } from "../apis/deepl";
import { genBaidu } from "../apis/baidu";
import { msAuth } from "../libs/auth";
import { genDeeplFree } from "./deepl";
import { genBaidu } from "./baidu";
const keyMap = new Map();
const urlMap = new Map();
// 轮询key
const keyPick = (translator, key = "") => {
// 轮询key/url
const keyPick = (translator, key = "", cacheMap) => {
const keys = key
.split(/\n|,/)
.map((item) => item.trim())
@@ -41,30 +42,13 @@ const keyPick = (translator, key = "") => {
return "";
}
const preIndex = keyMap.get(translator) ?? -1;
const preIndex = cacheMap.get(translator) ?? -1;
const curIndex = (preIndex + 1) % keys.length;
keyMap.set(translator, curIndex);
cacheMap.set(translator, curIndex);
return keys[curIndex];
};
/**
* 构造缓存 request
* @param {*} request
* @returns
*/
export const newCacheReq = async (input, init) => {
let request = new Request(input, init);
if (request.method !== "GET") {
const body = await request.text();
const cacheUrl = new URL(request.url);
cacheUrl.pathname += body;
request = new Request(cacheUrl.toString(), { method: "GET" });
}
return request;
};
const genGoogle = ({ text, from, to, url, key }) => {
const params = {
client: "gtx",
@@ -323,11 +307,11 @@ const genCustom = ({ text, from, to, url, key, customOption }) => {
};
/**
* 构造翻译接口 request
* 构造翻译接口请求参数
* @param {*}
* @returns
*/
export const newTransReq = ({ translator, text, from, to }, apiSetting) => {
export const genTransReq = ({ translator, text, from, to }, apiSetting) => {
const args = { text, from, to, ...apiSetting };
switch (translator) {
@@ -336,7 +320,10 @@ export const newTransReq = ({ translator, text, from, to }, apiSetting) => {
case OPT_TRANS_GEMINI:
case OPT_TRANS_CLOUDFLAREAI:
case OPT_TRANS_NIUTRANS:
args.key = keyPick(translator, args.key);
args.key = keyPick(translator, args.key, keyMap);
break;
case OPT_TRANS_DEEPLX:
args.url = keyPick(translator, args.url, urlMap);
break;
default:
}

View File

@@ -1,8 +1,7 @@
import browser from "webextension-polyfill";
import {
MSG_FETCH,
MSG_FETCH_LIMIT,
MSG_FETCH_CLEAR,
MSG_GET_HTTPCACHE,
MSG_TRANS_TOGGLE,
MSG_OPEN_OPTIONS,
MSG_SAVE_RULE,
@@ -21,7 +20,7 @@ import {
} from "./config";
import { getSettingWithDefault, tryInitDefaultData } from "./libs/storage";
import { trySyncSettingAndRules } from "./libs/sync";
import { fetchData, fetchPool } from "./libs/fetch";
import { fetchHandle, getHttpCache } from "./libs/fetch";
import { sendTabMsg } from "./libs/msg";
import { trySyncAllSubRules } from "./libs/subRules";
import { tryClearCaches } from "./libs";
@@ -169,13 +168,10 @@ browser.runtime.onStartup.addListener(async () => {
browser.runtime.onMessage.addListener(async ({ action, args }) => {
switch (action) {
case MSG_FETCH:
const { input, opts } = args;
return await fetchData(input, opts);
case MSG_FETCH_LIMIT:
const { interval, limit } = args;
return fetchPool.update(interval, limit);
case MSG_FETCH_CLEAR:
return fetchPool.clear();
return await fetchHandle(args);
case MSG_GET_HTTPCACHE:
const { input, init } = args;
return await getHttpCache(input, init);
case MSG_OPEN_OPTIONS:
return await browser.runtime.openOptionsPage();
case MSG_SAVE_RULE:

View File

@@ -140,6 +140,7 @@ function showTransbox({
tranboxSetting = DEFAULT_TRANBOX_SETTING,
transApis,
darkMode,
uiLang,
}) {
if (!tranboxSetting?.transOpen) {
return;
@@ -170,6 +171,7 @@ function showTransbox({
contextMenuType={contextMenuType}
tranboxSetting={tranboxSetting}
transApis={transApis}
uiLang={uiLang}
/>
</CacheProvider>
</React.StrictMode>

View File

@@ -710,12 +710,20 @@ export const I18N = {
en: `Open Translate Popup/Translate Selected Shortcut`,
},
tranbtn_offset_x: {
zh: `翻译按钮偏移X0-100`,
en: `Translate Button Offset X (0-100)`,
zh: `翻译按钮偏移X±200`,
en: `Translate Button Offset X (±200)`,
},
tranbtn_offset_y: {
zh: `翻译按钮偏移Y0-100`,
en: `Translate Button Offset Y (0-100)`,
zh: `翻译按钮偏移Y±200`,
en: `Translate Button Offset Y (±200)`,
},
tranbox_offset_x: {
zh: `翻译框偏移X±200`,
en: `Translate Box Offset X (±200)`,
},
tranbox_offset_y: {
zh: `翻译框偏移Y±200`,
en: `Translate Box Offset Y (±200)`,
},
translated_text: {
zh: `译文`,
@@ -790,8 +798,8 @@ export const I18N = {
en: `Secondary Context Menus`,
},
mulkeys_help: {
zh: `支持用换行或英文逗号“,”分隔多个KEY轮询调用。`,
en: `Supports multiple KEY polling calls separated by newlines or English commas ",".`,
zh: `支持用换行或英文逗号“,”分隔轮询调用。`,
en: `Supports polling calls separated by newlines or English commas ",".`,
},
translation_element_tag: {
zh: `译文元素标签`,
@@ -818,8 +826,8 @@ export const I18N = {
en: `Fixer Selector`,
},
reg_niutrans: {
zh: `获取小牛翻译密钥`,
en: `Get NiuTrans APIKey`,
zh: `获取小牛翻译密钥【简约翻译专属新用户注册赠送300万字符】`,
en: `Get NiuTrans APIKey [KISS Translator Exclusive New User Registration Free 3 Million Characters]`,
},
trigger_mode: {
zh: `触发方式`,
@@ -845,4 +853,24 @@ export const I18N = {
zh: `自定义选项`,
en: `Custom Option`,
},
translate_selected_text: {
zh: `翻译选中文字`,
en: `Translate Selected Text`,
},
toggle_style: {
zh: `切换样式`,
en: `Toggle Style`,
},
open_menu: {
zh: `打开弹窗菜单`,
en: `Open Popup Menu`,
},
open_setting: {
zh: `打开设置`,
en: `Open Setting`,
},
follow_selection: {
zh: `翻译框跟随选中文本`,
en: `Transbox Follow Selection`,
},
};

View File

@@ -51,8 +51,7 @@ export const KV_SALT_SHARE = "KISS-Translator-SHARE";
export const CACHE_NAME = `${APP_NAME}_cache`;
export const MSG_FETCH = "fetch";
export const MSG_FETCH_LIMIT = "fetch_limit";
export const MSG_FETCH_CLEAR = "fetch_clear";
export const MSG_GET_HTTPCACHE = "get_httpcache";
export const MSG_OPEN_OPTIONS = "open_options";
export const MSG_SAVE_RULE = "save_rule";
export const MSG_TRANS_TOGGLE = "trans_toggle";
@@ -431,9 +430,12 @@ export const DEFAULT_TRANBOX_SETTING = {
tranboxShortcut: DEFAULT_TRANBOX_SHORTCUT,
btnOffsetX: 10,
btnOffsetY: 10,
boxOffsetX: 0,
boxOffsetY: 10,
hideTranBtn: false, // 是否隐藏翻译按钮
hideClickAway: false, // 是否点击外部关闭弹窗
simpleStyle: false, // 是否简洁界面
followSelection: false, // 翻译框是否跟随选中文本
triggerMode: OPT_TRANBOX_TRIGGER_CLICK, // 触发翻译方式
extStyles: "", // 附加样式
};

View File

@@ -2,6 +2,14 @@ import { useSetting } from "./Setting";
import { I18N, URL_RAW_PREFIX } from "../config";
import { useFetch } from "./Fetch";
export const getI18n = (uiLang, key, defaultText = "") => {
return I18N?.[key]?.[uiLang] ?? defaultText;
};
export const useLangMap = (uiLang) => {
return (key, defaultText = "") => getI18n(uiLang, key, defaultText);
};
/**
* 多语言 hook
* @returns
@@ -10,7 +18,7 @@ export const useI18n = () => {
const {
setting: { uiLang },
} = useSetting();
return (key, defaultText = "") => I18N?.[key]?.[uiLang] ?? defaultText;
return useLangMap(uiLang);
};
export const useI18nMd = (key) => {

View File

@@ -1,6 +1,6 @@
import { getMsauth, setMsauth } from "./storage";
import { URL_MICROSOFT_AUTH } from "../config";
import { fetchData } from "./fetch";
import { fetchHandle } from "./fetch";
import { kissLog } from "./log";
const parseMSToken = (token) => {
@@ -35,7 +35,7 @@ const _msAuth = () => {
}
// 缓存没有或失效,查询接口
token = await fetchData(URL_MICROSOFT_AUTH);
token = await fetchHandle({ input: URL_MICROSOFT_AUTH });
exp = parseMSToken(token);
await setMsauth({ token, exp });
return [token, exp];

View File

@@ -3,19 +3,36 @@ import { sendBgMsg } from "./msg";
import { taskPool } from "./pool";
import {
MSG_FETCH,
MSG_FETCH_LIMIT,
MSG_FETCH_CLEAR,
MSG_GET_HTTPCACHE,
CACHE_NAME,
DEFAULT_FETCH_INTERVAL,
DEFAULT_FETCH_LIMIT,
} from "../config";
import { isBg } from "./browser";
import { newCacheReq, newTransReq } from "./req";
import { genTransReq } from "../apis/trans";
import { kissLog } from "./log";
import { blobToBase64 } from "./utils";
const TIMEOUT = 5000;
/**
* 构造缓存 request
* @param {*} input
* @param {*} init
* @returns
*/
const newCacheReq = async (input, init) => {
let request = new Request(input, init);
if (request.method !== "GET") {
const body = await request.text();
const cacheUrl = new URL(request.url);
cacheUrl.pathname += body;
request = new Request(cacheUrl.toString(), { method: "GET" });
}
return request;
};
/**
* 油猴脚本的请求封装
* @param {*} input
@@ -31,7 +48,7 @@ export const fetchGM = async (input, { method = "GET", headers, body } = {}) =>
data: body,
// withCredentials: true,
timeout: TIMEOUT,
onload: ({ response, responseHeaders, status, statusText, ...opts }) => {
onload: ({ response, responseHeaders, status, statusText }) => {
const headers = {};
responseHeaders.split("\n").forEach((line) => {
const [name, value] = line.split(":").map((item) => item.trim());
@@ -55,9 +72,9 @@ export const fetchGM = async (input, { method = "GET", headers, body } = {}) =>
* @param {*} param0
* @returns
*/
export const fetchApi = async ({ input, init, transOpts, apiSetting }) => {
export const fetchPatcher = async (input, init, transOpts, apiSetting) => {
if (transOpts?.translator) {
[input, init] = await newTransReq(transOpts, apiSetting);
[input, init] = await genTransReq(transOpts, apiSetting);
}
if (!input) {
@@ -99,68 +116,13 @@ export const fetchApi = async ({ input, init, transOpts, apiSetting }) => {
};
/**
* 请求池实例
*/
export const fetchPool = taskPool(
fetchApi,
null,
DEFAULT_FETCH_INTERVAL,
DEFAULT_FETCH_LIMIT
);
/**
* 请求数据统一接口
* @param {*} input
* @param {*} opts
* 解析 response
* @param {*} res
* @returns
*/
export const fetchData = async (
input,
{ useCache, usePool, transOpts, apiSetting, ...init } = {}
) => {
const cacheReq = await newCacheReq(input, init);
let res;
// 查询缓存
if (useCache) {
try {
const cache = await caches.open(CACHE_NAME);
res = await cache.match(cacheReq);
} catch (err) {
kissLog(err, "cache match");
}
}
const parseResponse = async (res) => {
if (!res) {
// 发送请求
if (usePool) {
res = await fetchPool.push({ input, init, transOpts, apiSetting });
} else {
res = await fetchApi({ input, init, transOpts, apiSetting });
}
if (!res) {
throw new Error("Unknow error");
} else if (!res.ok) {
const msg = {
url: res.url,
status: res.status,
};
if (res.headers.get("Content-Type")?.includes("json")) {
msg.response = await res.json();
}
throw new Error(JSON.stringify(msg));
}
// 插入缓存
if (useCache) {
try {
const cache = await caches.open(CACHE_NAME);
await cache.put(cacheReq, res.clone());
} catch (err) {
kissLog(err, "cache put");
}
}
return null;
}
const contentType = res.headers.get("Content-Type");
@@ -174,23 +136,141 @@ export const fetchData = async (
};
/**
* fetch 兼容性封装
* 查询 caches
* @param {*} input
* @param {*} opts
* @param {*} param1
* @returns
*/
export const fetchPolyfill = async (input, opts) => {
export const getHttpCache = async (input, { method, headers, body }) => {
try {
const req = await newCacheReq(input, { method, headers, body });
const cache = await caches.open(CACHE_NAME);
const res = await cache.match(req);
return parseResponse(res);
} catch (err) {
kissLog(err, "get cache");
}
return null;
};
/**
* 插入 caches
* @param {*} input
* @param {*} param1
* @param {*} res
*/
export const putHttpCache = async (input, { method, headers, body }, res) => {
try {
const req = await newCacheReq(input, { method, headers, body });
const cache = await caches.open(CACHE_NAME);
await cache.put(req, res);
} catch (err) {
kissLog(err, "put cache");
}
};
/**
* 处理请求
* @param {*} param0
* @returns
*/
export const fetchHandle = async ({
input,
useCache,
transOpts,
apiSetting,
...init
}) => {
// 发送请求
const res = await fetchPatcher(input, init, transOpts, apiSetting);
if (!res) {
throw new Error("Unknow error");
} else if (!res.ok) {
const msg = {
url: res.url,
status: res.status,
};
if (res.headers.get("Content-Type")?.includes("json")) {
msg.response = await res.json();
}
throw new Error(JSON.stringify(msg));
}
// 插入缓存
if (useCache) {
await putHttpCache(input, init, res.clone());
}
return parseResponse(res);
};
/**
* fetch 兼容性封装
* @param {*} args
* @returns
*/
export const fetchPolyfill = (args) => {
// 插件
if (isExt && !isBg()) {
return sendBgMsg(MSG_FETCH, args);
}
// 油猴/网页/BackgroundPage
return fetchHandle(args);
};
/**
* getHttpCache 兼容性封装
* @param {*} input
* @param {*} init
* @returns
*/
export const getHttpCachePolyfill = (input, init) => {
// 插件
if (isExt && !isBg()) {
return sendBgMsg(MSG_GET_HTTPCACHE, { input, init });
}
// 油猴/网页/BackgroundPage
return getHttpCache(input, init);
};
/**
* 请求池实例
*/
export const fetchPool = taskPool(
fetchPolyfill,
null,
DEFAULT_FETCH_INTERVAL,
DEFAULT_FETCH_LIMIT
);
/**
* 数据请求
* @param {*} input
* @param {*} param1
* @returns
*/
export const fetchData = async (input, { useCache, usePool, ...args } = {}) => {
if (!input?.trim()) {
throw new Error("URL is empty");
}
// 插件
if (isExt && !isBg()) {
return await sendBgMsg(MSG_FETCH, { input, opts });
// 查询缓存
if (useCache) {
const cache = await getHttpCachePolyfill(input, args);
if (cache) {
return cache;
}
}
// 油猴/网页/BackgroundPage
return await fetchData(input, opts);
// 通过任务池发送请求
if (usePool) {
return fetchPool.push({ input, useCache, ...args });
}
// 直接请求
return fetchPolyfill({ input, useCache, ...args });
};
/**
@@ -198,21 +278,13 @@ export const fetchPolyfill = async (input, opts) => {
* @param {*} interval
* @param {*} limit
*/
export const updateFetchPool = async (interval, limit) => {
if (isExt) {
await sendBgMsg(MSG_FETCH_LIMIT, { interval, limit });
} else {
fetchPool.update(interval, limit);
}
export const updateFetchPool = (interval, limit) => {
fetchPool.update(interval, limit);
};
/**
* 清空任务池
*/
export const clearFetchPool = async () => {
if (isExt) {
await sendBgMsg(MSG_FETCH_CLEAR);
} else {
fetchPool.clear();
}
export const clearFetchPool = () => {
fetchPool.clear();
};

View File

@@ -20,13 +20,14 @@ import {
import { apiSyncData } from "../apis";
import { sha256, removeEndchar } from "./utils";
import { createClient, getPatcher } from "webdav";
import { fetchApi } from "./fetch";
import { fetchPatcher } from "./fetch";
import { kissLog } from "./log";
getPatcher().patch("request", (opts) => {
return fetchApi({
input: opts.url,
init: { method: opts.method, headers: opts.headers, body: opts.data },
return fetchPatcher(opts.url, {
method: opts.method,
headers: opts.headers,
body: opts.data,
});
});

View File

@@ -22,6 +22,7 @@ import {
import { shortcutRegister } from "../../libs/shortcut";
import { sendIframeMsg } from "../../libs/iframe";
import { kissLog } from "../../libs/log";
import { getI18n } from "../../hooks/I18n";
export default function Action({ translator, fab }) {
const fabWidth = 40;
@@ -96,11 +97,11 @@ export default function Action({ translator, fab }) {
// 注册菜单
try {
const menuCommandIds = [];
const { contextMenuType } = translator.setting;
const { contextMenuType, uiLang } = translator.setting;
contextMenuType !== 0 &&
menuCommandIds.push(
GM.registerMenuCommand(
"Toggle Translate",
getI18n(uiLang, "translate_switch"),
(event) => {
translator.toggle();
sendIframeMsg(MSG_TRANS_TOGGLE);
@@ -109,7 +110,7 @@ export default function Action({ translator, fab }) {
"Q"
),
GM.registerMenuCommand(
"Toggle Style",
getI18n(uiLang, "toggle_style"),
(event) => {
translator.toggleStyle();
sendIframeMsg(MSG_TRANS_TOGGLE_STYLE);
@@ -118,14 +119,14 @@ export default function Action({ translator, fab }) {
"C"
),
GM.registerMenuCommand(
"Open Menu",
getI18n(uiLang, "open_menu"),
(event) => {
setShowPopup((pre) => !pre);
},
"K"
),
GM.registerMenuCommand(
"Open Setting",
getI18n(uiLang, "open_setting"),
(event) => {
window.open(process.env.REACT_APP_OPTIONSPAGE, "_blank");
},

View File

@@ -6,6 +6,7 @@ import {
OPT_TRANS_ALL,
OPT_TRANS_MICROSOFT,
OPT_TRANS_DEEPL,
OPT_TRANS_DEEPLX,
OPT_TRANS_DEEPLFREE,
OPT_TRANS_BAIDU,
OPT_TRANS_TENCENT,
@@ -171,6 +172,11 @@ function ApiFields({ translator }) {
name="url"
value={url}
onChange={handleChange}
multiline={translator === OPT_TRANS_DEEPLX}
maxRows={10}
helperText={
translator === OPT_TRANS_DEEPLX ? i18n("mulkeys_help") : ""
}
/>
<TextField
size="small"
@@ -179,6 +185,7 @@ function ApiFields({ translator }) {
value={key}
onChange={handleChange}
multiline={mulkeysTranslators.includes(translator)}
maxRows={10}
helperText={keyHelper}
/>
</>
@@ -200,6 +207,7 @@ function ApiFields({ translator }) {
value={prompt}
onChange={handleChange}
multiline
maxRows={10}
/>
</>
)}
@@ -231,6 +239,7 @@ function ApiFields({ translator }) {
value={customOption}
onChange={handleChange}
multiline
maxRows={10}
/>
)}

View File

@@ -27,10 +27,10 @@ export default function Tranbox() {
let { name, value } = e.target;
switch (name) {
case "btnOffsetX":
value = limitNumber(value, 0, 100);
break;
case "btnOffsetY":
value = limitNumber(value, 0, 100);
case "boxOffsetX":
case "boxOffsetY":
value = limitNumber(value, -200, 200);
break;
default:
}
@@ -55,9 +55,12 @@ export default function Tranbox() {
tranboxShortcut,
btnOffsetX,
btnOffsetY,
boxOffsetX = 0,
boxOffsetY = 10,
hideTranBtn = false,
hideClickAway = false,
simpleStyle = false,
followSelection = false,
triggerMode = OPT_TRANBOX_TRIGGER_CLICK,
extStyles = "",
} = tranboxSetting;
@@ -158,6 +161,24 @@ export default function Tranbox() {
onChange={handleChange}
/>
<TextField
size="small"
label={i18n("tranbox_offset_x")}
type="number"
name="boxOffsetX"
defaultValue={boxOffsetX}
onChange={handleChange}
/>
<TextField
size="small"
label={i18n("tranbox_offset_y")}
type="number"
name="boxOffsetY"
defaultValue={boxOffsetY}
onChange={handleChange}
/>
<TextField
select
size="small"
@@ -194,6 +215,18 @@ export default function Tranbox() {
<MenuItem value={true}>{i18n("enable")}</MenuItem>
</TextField>
<TextField
select
size="small"
name="followSelection"
value={followSelection}
label={i18n("follow_selection")}
onChange={handleChange}
>
<MenuItem value={false}>{i18n("disable")}</MenuItem>
<MenuItem value={true}>{i18n("enable")}</MenuItem>
</TextField>
<TextField
select
size="small"

View File

@@ -1,4 +1,4 @@
import { useEffect, useState } from "react";
import { useState } from "react";
import Paper from "@mui/material/Paper";
import Box from "@mui/material/Box";
import { isMobile } from "../../libs/mobile";
@@ -130,11 +130,11 @@ function Pointer({
export default function DraggableResizable({
header,
children,
defaultPosition = {
position = {
x: 0,
y: 0,
},
defaultSize = {
size = {
w: 600,
h: 400,
},
@@ -146,14 +146,13 @@ export default function DraggableResizable({
w: 1200,
h: 1200,
},
setSize,
setPosition,
onChangeSize,
onChangePosition,
...props
}) {
const lineWidth = 4;
const [position, setPosition] = useState(defaultPosition);
const [size, setSize] = useState(defaultSize);
const opts = {
size,
setSize,
@@ -163,14 +162,6 @@ export default function DraggableResizable({
maxSize,
};
useEffect(() => {
onChangeSize && onChangeSize(size);
}, [size, onChangeSize]);
useEffect(() => {
onChangePosition && onChangePosition(position);
}, [position, onChangePosition]);
return (
<Box
className="KT-draggable"

View File

@@ -14,6 +14,8 @@ import UnfoldLessIcon from "@mui/icons-material/UnfoldLess";
import UnfoldMoreIcon from "@mui/icons-material/UnfoldMore";
import PushPinIcon from "@mui/icons-material/PushPin";
import PushPinOutlinedIcon from "@mui/icons-material/PushPinOutlined";
import LockIcon from "@mui/icons-material/Lock";
import LockOpenIcon from "@mui/icons-material/LockOpen";
import CloseIcon from "@mui/icons-material/Close";
import { useI18n } from "../../hooks/I18n";
import { OPT_TRANS_ALL, OPT_LANGS_FROM, OPT_LANGS_TO } from "../../config";
@@ -30,9 +32,15 @@ function Header({
setSimpleStyle,
hideClickAway,
setHideClickAway,
followSelection,
setFollowSelection,
}) {
return (
<Box className="KT-transbox-header">
<Box
className="KT-transbox-header"
onMouseUp={(e) => e.stopPropagation()}
onTouchEnd={(e) => e.stopPropagation()}
>
<Stack direction="row" justifyContent="space-between" alignItems="center">
<DragIndicatorIcon fontSize="small" />
<Stack direction="row" alignItems="center">
@@ -43,6 +51,18 @@ function Header({
}}
>
{hideClickAway ? (
<LockOpenIcon fontSize="small" />
) : (
<LockIcon fontSize="small" />
)}
</IconButton>
<IconButton
size="small"
onClick={() => {
setFollowSelection((pre) => !pre);
}}
>
{followSelection ? (
<PushPinOutlinedIcon fontSize="small" />
) : (
<PushPinIcon fontSize="small" />
@@ -239,14 +259,18 @@ export default function TranBox({
setSimpleStyle,
hideClickAway,
setHideClickAway,
followSelection,
setFollowSelection,
extStyles,
}) {
return (
<SettingProvider>
<ThemeProvider styles={extStyles}>
<DraggableResizable
defaultPosition={boxPosition}
defaultSize={boxSize}
position={boxPosition}
size={boxSize}
setSize={setBoxSize}
setPosition={setBoxPosition}
header={
<Header
setShowPopup={setShowBox}
@@ -254,10 +278,10 @@ export default function TranBox({
setSimpleStyle={setSimpleStyle}
hideClickAway={hideClickAway}
setHideClickAway={setHideClickAway}
followSelection={followSelection}
setFollowSelection={setFollowSelection}
/>
}
onChangeSize={setBoxSize}
onChangePosition={setBoxPosition}
onClick={(e) => e.stopPropagation()}
>
<TranForm

View File

@@ -5,18 +5,11 @@ export default function TranBtn({
onTrigger,
btnEvent,
position,
tranboxSetting,
btnOffsetX,
btnOffsetY,
}) {
const left = limitNumber(
position.x + tranboxSetting.btnOffsetX,
0,
window.innerWidth - 32
);
const top = limitNumber(
position.y + tranboxSetting.btnOffsetY,
0,
window.innerHeight - 32
);
const left = limitNumber(position.x + btnOffsetX, 0, window.innerWidth - 32);
const top = limitNumber(position.y + btnOffsetY, 0, window.innerHeight - 32);
return (
<div

View File

@@ -13,19 +13,26 @@ import {
} from "../../config";
import { isMobile } from "../../libs/mobile";
import { kissLog } from "../../libs/log";
import { useLangMap } from "../../hooks/I18n";
export default function Slection({
contextMenuType,
tranboxSetting,
transApis,
uiLang,
}) {
const {
hideTranBtn = false,
simpleStyle: initSimpleStyle = false,
hideClickAway: initHideClickAway = false,
followSelection: initFollowMouse = false,
tranboxShortcut = DEFAULT_TRANBOX_SHORTCUT,
triggerMode = OPT_TRANBOX_TRIGGER_CLICK,
extStyles,
btnOffsetX,
btnOffsetY,
boxOffsetX = 0,
boxOffsetY = 10,
} = tranboxSetting;
const boxWidth =
@@ -37,6 +44,7 @@ export default function Slection({
? 200
: limitNumber(window.innerHeight, 200, 400);
const langMap = useLangMap(uiLang);
const [showBox, setShowBox] = useState(false);
const [showBtn, setShowBtn] = useState(false);
const [selectedText, setSelText] = useState("");
@@ -52,6 +60,7 @@ export default function Slection({
});
const [simpleStyle, setSimpleStyle] = useState(initSimpleStyle);
const [hideClickAway, setHideClickAway] = useState(initHideClickAway);
const [followSelection, setFollowSelection] = useState(initFollowMouse);
const handleTrigger = useCallback(
(text) => {
@@ -65,16 +74,27 @@ export default function Slection({
const handleTranbox = useCallback(() => {
setShowBtn(false);
const selectedText = window.getSelection()?.toString()?.trim() || "";
const selection = window.getSelection();
const selectedText = selection?.toString()?.trim() || "";
if (!selectedText) {
setShowBox((pre) => !pre);
return;
}
const rect = selection?.getRangeAt(0)?.getBoundingClientRect();
if (rect && followSelection) {
const x = (rect.left + rect.right) / 2 + boxOffsetX;
const y = rect.bottom + boxOffsetY;
setBoxPosition({
x: limitNumber(x, 0, window.innerWidth - 300),
y: limitNumber(y, 0, window.innerHeight - 200),
});
}
setSelText(selectedText);
setText(selectedText);
setShowBox(true);
}, []);
}, [followSelection, boxOffsetX, boxOffsetY]);
const btnEvent = useMemo(() => {
if (isMobile) {
@@ -90,13 +110,24 @@ export default function Slection({
e.stopPropagation();
await sleep(200);
const selectedText = window.getSelection()?.toString()?.trim() || "";
const selection = window.getSelection();
const selectedText = selection?.toString()?.trim() || "";
setSelText(selectedText);
if (!selectedText) {
setShowBtn(false);
return;
}
const rect = selection?.getRangeAt(0)?.getBoundingClientRect();
if (rect && followSelection) {
const x = (rect.left + rect.right) / 2 + boxOffsetX;
const y = rect.bottom + boxOffsetY;
setBoxPosition({
x: limitNumber(x, 0, window.innerWidth - 300),
y: limitNumber(y, 0, window.innerHeight - 200),
});
}
if (triggerMode === OPT_TRANBOX_TRIGGER_SELECT) {
handleTrigger(selectedText);
return;
@@ -116,7 +147,14 @@ export default function Slection({
handleMouseup
);
};
}, [hideTranBtn, triggerMode, handleTrigger]);
}, [
hideTranBtn,
triggerMode,
followSelection,
boxOffsetX,
boxOffsetY,
handleTrigger,
]);
useEffect(() => {
if (isExt) {
@@ -146,7 +184,7 @@ export default function Slection({
contextMenuType !== 0 &&
menuCommandIds.push(
GM.registerMenuCommand(
"Translate Selected Text",
langMap("translate_selected_text"),
(event) => {
handleTranbox();
},
@@ -162,7 +200,7 @@ export default function Slection({
} catch (err) {
kissLog(err, "registerMenuCommand");
}
}, [handleTranbox, contextMenuType]);
}, [handleTranbox, contextMenuType, langMap]);
useEffect(() => {
if (hideClickAway) {
@@ -193,6 +231,8 @@ export default function Slection({
setSimpleStyle={setSimpleStyle}
hideClickAway={hideClickAway}
setHideClickAway={setHideClickAway}
followSelection={followSelection}
setFollowSelection={setFollowSelection}
extStyles={extStyles}
/>
)}
@@ -200,7 +240,8 @@ export default function Slection({
{showBtn && (
<TranBtn
position={position}
tranboxSetting={tranboxSetting}
btnOffsetX={btnOffsetX}
btnOffsetY={btnOffsetY}
btnEvent={btnEvent}
onTrigger={(e) => {
e.stopPropagation();