feat: add preinit setting

This commit is contained in:
Gabe
2025-09-25 11:31:12 +08:00
parent 1dabbfc4de
commit 393f1a29d5
10 changed files with 613 additions and 538 deletions

View File

@@ -1397,4 +1397,9 @@ export const I18N = {
en: `If you do not fully understand the default prompt, please do not modify it at will, otherwise the translation may fail.`,
zh_TW: `在未完全理解預設Prompt的情況下請勿隨意修改否則可能翻譯失敗。`,
},
if_pre_init: {
zh: `是否预初始化`,
en: `Whether to pre-initialize`,
zh_TW: `是否預初始化`,
},
};

View File

@@ -109,7 +109,7 @@ export const DEFAULT_SUBRULES_LIST = [
},
];
export const DEFAULT_MOUSEHOVER_KEY = ["ControlLeft"];
export const DEFAULT_MOUSEHOVER_KEY = ["KeyQ"];
export const DEFAULT_MOUSE_HOVER_SETTING = {
useMouseHover: true, // 是否启用鼠标悬停翻译
mouseHoverKey: DEFAULT_MOUSEHOVER_KEY, // 鼠标悬停翻译组合键
@@ -148,4 +148,5 @@ export const DEFAULT_SETTING = {
transInterval: 100, // 翻译等待时间
langDetector: OPT_TRANS_MICROSOFT, // 远程语言识别服务
mouseHoverSetting: DEFAULT_MOUSE_HOVER_SETTING, // 鼠标悬停翻译
preInit: true, // 是否预加载脚本
};

View File

@@ -53,9 +53,9 @@ export function useStorage(key, defaultVal = null, syncKey = "") {
// 远端同步
const runSync = useCallback(async (keyToSync, valueToSync) => {
try {
const { value, isNew } = await syncData(keyToSync, valueToSync);
if (isNew) {
setData(value);
const res = await syncData(keyToSync, valueToSync);
if (res?.isNew) {
setData(res.value);
}
} catch (error) {
kissLog("Sync failed", keyToSync);

View File

@@ -70,7 +70,8 @@ export const syncData = async (key, value) => {
syncMeta = {},
} = await getSyncWithDefault();
if (!syncUrl || !syncKey || (syncType === OPT_SYNCTYPE_WEBDAV && !syncUser)) {
throw new Error("sync args err");
// throw new Error("sync args err");
return;
}
let { updateAt = 0, syncAt = 0 } = syncMeta[key] || {};

View File

@@ -325,13 +325,19 @@ export class Translator {
this.#enableMouseHover();
}
// 是否默认启动
if (document.readyState === "loading") {
document.addEventListener("DOMContentLoaded", () => this.#run());
} else {
this.#run();
}
}
// 启动
#run() {
if (this.#rule.transOpen === "true") {
if (document.readyState === "loading") {
document.addEventListener("DOMContentLoaded", () => this.enable());
} else {
this.enable();
}
this.enable();
} else if (this.#setting.preInit) {
this.#init();
}
}
@@ -1242,13 +1248,17 @@ export class Translator {
// 注入JS/CSS
#initInjector() {
const { injectJs, injectCss } = this.#rule;
if (isExt) {
injectJs && sendBgMsg(MSG_INJECT_JS, injectJs);
injectCss && sendBgMsg(MSG_INJECT_CSS, injectCss);
} else {
injectJs && injectInlineJs(injectJs);
injectCss && injectInternalCss(injectCss);
try {
const { injectJs, injectCss } = this.#rule;
if (isExt) {
injectJs && sendBgMsg(MSG_INJECT_JS, injectJs);
injectCss && sendBgMsg(MSG_INJECT_CSS, injectCss);
} else {
injectJs && injectInlineJs(injectJs);
injectCss && injectInternalCss(injectCss);
}
} catch (err) {
kissLog("inject js");
}
}

View File

@@ -282,7 +282,7 @@ function ApiFields({ apiSlug, isUserApi, deleteApi }) {
<>
<Box>
<Grid container spacing={2} columns={12}>
<Grid item xs={6} sm={6} md={6} lg={3}>
<Grid item xs={12} sm={6} md={6} lg={3}>
{/* todo 改成 ReusableAutocomplete 可选择和填写模型 */}
<TextField
size="small"
@@ -293,7 +293,7 @@ function ApiFields({ apiSlug, isUserApi, deleteApi }) {
onChange={handleChange}
/>
</Grid>
<Grid item xs={6} sm={6} md={6} lg={3}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<ReusableAutocomplete
freeSolo
size="small"
@@ -305,7 +305,7 @@ function ApiFields({ apiSlug, isUserApi, deleteApi }) {
onChange={handleChange}
/>
</Grid>
<Grid item xs={6} sm={6} md={6} lg={3}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
size="small"
fullWidth
@@ -316,7 +316,7 @@ function ApiFields({ apiSlug, isUserApi, deleteApi }) {
onChange={handleChange}
/>
</Grid>
<Grid item xs={6} sm={6} md={6} lg={3}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
size="small"
fullWidth
@@ -327,7 +327,7 @@ function ApiFields({ apiSlug, isUserApi, deleteApi }) {
onChange={handleChange}
/>
</Grid>
<Grid item xs={6} sm={6} md={6} lg={3}></Grid>
<Grid item xs={12} sm={6} md={6} lg={3}></Grid>
</Grid>
</Box>
@@ -485,7 +485,7 @@ function ApiFields({ apiSlug, isUserApi, deleteApi }) {
{API_SPE_TYPES.batch.has(api.apiType) && (
<Box>
<Grid container spacing={2} columns={12}>
<Grid item xs={6} sm={6} md={6} lg={3}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
fullWidth
@@ -499,7 +499,7 @@ function ApiFields({ apiSlug, isUserApi, deleteApi }) {
<MenuItem value={true}>{i18n("enable")}</MenuItem>
</TextField>
</Grid>
<Grid item xs={6} sm={6} md={6} lg={3}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
size="small"
fullWidth
@@ -510,7 +510,7 @@ function ApiFields({ apiSlug, isUserApi, deleteApi }) {
onChange={handleChange}
/>
</Grid>
<Grid item xs={6} sm={6} md={6} lg={3}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
size="small"
fullWidth
@@ -521,7 +521,7 @@ function ApiFields({ apiSlug, isUserApi, deleteApi }) {
onChange={handleChange}
/>
</Grid>
<Grid item xs={6} sm={6} md={6} lg={3}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
size="small"
fullWidth
@@ -540,7 +540,7 @@ function ApiFields({ apiSlug, isUserApi, deleteApi }) {
<>
<Box>
<Grid container spacing={2} columns={12}>
<Grid item xs={6} sm={6} md={6} lg={3}>
<Grid item xs={12} sm={6} md={6} lg={3}>
{" "}
<TextField
select
@@ -555,7 +555,7 @@ function ApiFields({ apiSlug, isUserApi, deleteApi }) {
<MenuItem value={true}>{i18n("enable")}</MenuItem>
</TextField>
</Grid>
<Grid item xs={6} sm={6} md={6} lg={3}>
<Grid item xs={12} sm={6} md={6} lg={3}>
{" "}
<TextField
size="small"
@@ -574,7 +574,7 @@ function ApiFields({ apiSlug, isUserApi, deleteApi }) {
<Box>
<Grid container spacing={2} columns={12}>
<Grid item xs={6} sm={6} md={6} lg={3}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
size="small"
fullWidth
@@ -585,7 +585,7 @@ function ApiFields({ apiSlug, isUserApi, deleteApi }) {
onChange={handleChange}
/>
</Grid>
<Grid item xs={6} sm={6} md={6} lg={3}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
size="small"
fullWidth
@@ -596,7 +596,7 @@ function ApiFields({ apiSlug, isUserApi, deleteApi }) {
onChange={handleChange}
/>
</Grid>
<Grid item xs={6} sm={6} md={6} lg={3}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
size="small"
fullWidth
@@ -607,11 +607,17 @@ function ApiFields({ apiSlug, isUserApi, deleteApi }) {
onChange={handleChange}
/>
</Grid>
<Grid item xs={6} sm={6} md={6} lg={3}></Grid>
<Grid item xs={12} sm={6} md={6} lg={3}></Grid>
</Grid>
</Box>
<Stack direction="row" spacing={2}>
<Stack
direction="row"
alignItems="center"
spacing={2}
useFlexGap
flexWrap="wrap"
>
<Button
size="small"
variant="contained"
@@ -639,7 +645,6 @@ function ApiFields({ apiSlug, isUserApi, deleteApi }) {
control={
<Switch
size="small"
fullWidth
name="isDisabled"
checked={isDisabled}
onChange={handleChange}

View File

@@ -71,71 +71,84 @@ export default function InputSetting() {
label={i18n("use_input_box_translation")}
/>
<TextField
select
size="small"
name="apiSlug"
value={apiSlug}
label={i18n("translate_service")}
onChange={handleChange}
>
{enabledApis.map((api) => (
<MenuItem key={api.apiSlug} value={api.apiSlug}>
{api.apiName}
</MenuItem>
))}
</TextField>
<TextField
select
size="small"
name="fromLang"
value={fromLang}
label={i18n("from_lang")}
onChange={handleChange}
>
{OPT_LANGS_FROM.map(([lang, name]) => (
<MenuItem key={lang} value={lang}>
{name}
</MenuItem>
))}
</TextField>
<TextField
select
size="small"
name="toLang"
value={toLang}
label={i18n("to_lang")}
onChange={handleChange}
>
{OPT_LANGS_TO.map(([lang, name]) => (
<MenuItem key={lang} value={lang}>
{name}
</MenuItem>
))}
</TextField>
<TextField
select
size="small"
name="transSign"
value={transSign}
label={i18n("input_trans_start_sign")}
onChange={handleChange}
helperText={i18n("input_trans_start_sign_help")}
>
<MenuItem value={""}>{i18n("style_none")}</MenuItem>
{OPT_INPUT_TRANS_SIGNS.map((item) => (
<MenuItem key={item} value={item}>
{item}
</MenuItem>
))}
</TextField>
<Box>
<Grid container spacing={2} columns={12}>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
select
fullWidth
size="small"
name="apiSlug"
value={apiSlug}
label={i18n("translate_service")}
onChange={handleChange}
>
{enabledApis.map((api) => (
<MenuItem key={api.apiSlug} value={api.apiSlug}>
{api.apiName}
</MenuItem>
))}
</TextField>
</Grid>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
select
fullWidth
size="small"
name="fromLang"
value={fromLang}
label={i18n("from_lang")}
onChange={handleChange}
>
{OPT_LANGS_FROM.map(([lang, name]) => (
<MenuItem key={lang} value={lang}>
{name}
</MenuItem>
))}
</TextField>
</Grid>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
select
fullWidth
size="small"
name="toLang"
value={toLang}
label={i18n("to_lang")}
onChange={handleChange}
>
{OPT_LANGS_TO.map(([lang, name]) => (
<MenuItem key={lang} value={lang}>
{name}
</MenuItem>
))}
</TextField>
</Grid>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
select
fullWidth
size="small"
name="transSign"
value={transSign}
label={i18n("input_trans_start_sign")}
onChange={handleChange}
helperText={i18n("input_trans_start_sign_help")}
>
<MenuItem value={""}>{i18n("style_none")}</MenuItem>
{OPT_INPUT_TRANS_SIGNS.map((item) => (
<MenuItem key={item} value={item}>
{item}
</MenuItem>
))}
</TextField>
</Grid>
</Grid>
</Box>
<Box>
<Grid container spacing={2} columns={12}>
<Grid item xs={12} sm={12} md={4} lg={4}>
<Grid item xs={12} sm={12} md={6} lg={3}>
<ShortcutInput
value={triggerShortcut}
onChange={handleShortcutInput}
@@ -143,7 +156,7 @@ export default function InputSetting() {
helperText={i18n("trigger_trans_shortcut_help")}
/>
</Grid>
<Grid item xs={12} sm={12} md={4} lg={4}>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
select
fullWidth
@@ -160,7 +173,7 @@ export default function InputSetting() {
))}
</TextField>
</Grid>
<Grid item xs={12} sm={12} md={4} lg={4}>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
fullWidth
size="small"

View File

@@ -12,7 +12,7 @@ import {
OPT_LANGS_TO,
OPT_STYLE_ALL,
OPT_STYLE_DIY,
OPT_STYLE_USE_COLOR,
// OPT_STYLE_USE_COLOR,
URL_KISS_RULES_NEW_ISSUE,
OPT_SYNCTYPE_WORKER,
DEFAULT_TRANS_TAG,
@@ -289,7 +289,7 @@ function RuleFields({ rule, rules, setShow, setKeyword }) {
<Box>
<Grid container spacing={2} columns={12}>
<Grid item xs={12} sm={6} md={3} lg={2}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
size="small"
@@ -305,7 +305,7 @@ function RuleFields({ rule, rules, setShow, setKeyword }) {
<MenuItem value={"false"}>{i18n("default_disabled")}</MenuItem>
</TextField>
</Grid>
<Grid item xs={12} sm={6} md={3} lg={2}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
size="small"
@@ -321,7 +321,7 @@ function RuleFields({ rule, rules, setShow, setKeyword }) {
<MenuItem value={"true"}>{i18n("enable")}</MenuItem>
</TextField>
</Grid>
<Grid item xs={12} sm={6} md={3} lg={2}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
size="small"
@@ -337,7 +337,7 @@ function RuleFields({ rule, rules, setShow, setKeyword }) {
<MenuItem value={"true"}>{i18n("enable")}</MenuItem>
</TextField>
</Grid>
<Grid item xs={12} sm={6} md={3} lg={2}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
size="small"
@@ -353,7 +353,8 @@ function RuleFields({ rule, rules, setShow, setKeyword }) {
<MenuItem value={"true"}>{i18n("enable")}</MenuItem>
</TextField>
</Grid>
<Grid item xs={12} sm={6} md={3} lg={2}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
size="small"
@@ -369,7 +370,7 @@ function RuleFields({ rule, rules, setShow, setKeyword }) {
<MenuItem value={"true"}>{i18n("enable")}</MenuItem>
</TextField>
</Grid>
<Grid item xs={12} sm={6} md={3} lg={2}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
size="small"
@@ -385,31 +386,23 @@ function RuleFields({ rule, rules, setShow, setKeyword }) {
<MenuItem value={"true"}>{i18n("enable")}</MenuItem>
</TextField>
</Grid>
</Grid>
</Box>
<Box>
<Grid container spacing={2} columns={12}>
{/* <Grid item xs={12} sm={6} md={3} lg={2}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
size="small"
fullWidth
name="transTiming"
value={transTiming}
label={i18n("trigger_mode")}
name="transTag"
value={transTag}
label={i18n("translation_element_tag")}
disabled={disabled}
onChange={handleChange}
>
{GlobalItem}
{OPT_TIMING_ALL.map((item) => (
<MenuItem key={item} value={item}>
{i18n(item)}
</MenuItem>
))}
<MenuItem value={"span"}>{`<span>`}</MenuItem>
<MenuItem value={"font"}>{`<font>`}</MenuItem>
</TextField>
</Grid> */}
<Grid item xs={12} sm={6} md={3} lg={2}>
</Grid>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
size="small"
@@ -425,7 +418,8 @@ function RuleFields({ rule, rules, setShow, setKeyword }) {
<MenuItem value={"true"}>{i18n("enable")}</MenuItem>
</TextField>
</Grid>
<Grid item xs={12} sm={6} md={3} lg={2}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
size="small"
@@ -444,7 +438,7 @@ function RuleFields({ rule, rules, setShow, setKeyword }) {
))}
</TextField>
</Grid>
<Grid item xs={12} sm={6} md={3} lg={2}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
size="small"
@@ -463,7 +457,7 @@ function RuleFields({ rule, rules, setShow, setKeyword }) {
))}
</TextField>
</Grid>
<Grid item xs={12} sm={6} md={3} lg={2}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
size="small"
@@ -482,74 +476,27 @@ function RuleFields({ rule, rules, setShow, setKeyword }) {
))}
</TextField>
</Grid>
<Grid item xs={12} sm={6} md={3} lg={2}>
{/* <Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
size="small"
fullWidth
name="textStyle"
value={textStyle}
label={i18n("text_style")}
name="transTiming"
value={transTiming}
label={i18n("trigger_mode")}
disabled={disabled}
onChange={handleChange}
>
{GlobalItem}
{OPT_STYLE_ALL.map((item) => (
{OPT_TIMING_ALL.map((item) => (
<MenuItem key={item} value={item}>
{i18n(item)}
</MenuItem>
))}
</TextField>
</Grid>
{OPT_STYLE_USE_COLOR.includes(textStyle) && (
<Grid item xs={12} sm={6} md={3} lg={2}>
<TextField
size="small"
fullWidth
name="bgColor"
value={bgColor}
label={i18n("bg_color")}
disabled={disabled}
onChange={handleChange}
/>
</Grid>
)}
</Grid>
</Box>
</Grid> */}
{textStyle === OPT_STYLE_DIY && (
<TextField
size="small"
label={i18n("diy_style")}
helperText={i18n("diy_style_helper")}
name="textDiyStyle"
value={textDiyStyle}
disabled={disabled}
onChange={handleChange}
maxRows={10}
multiline
/>
)}
<Box>
<Grid container spacing={2} columns={12}>
<Grid item xs={12} sm={6} md={3} lg={2}>
<TextField
select
size="small"
fullWidth
name="transTag"
value={transTag}
label={i18n("translation_element_tag")}
disabled={disabled}
onChange={handleChange}
>
{GlobalItem}
<MenuItem value={"span"}>{`<span>`}</MenuItem>
<MenuItem value={"font"}>{`<font>`}</MenuItem>
</TextField>
</Grid>
<Grid item xs={12} sm={6} md={3} lg={2}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
size="small"
@@ -568,36 +515,57 @@ function RuleFields({ rule, rules, setShow, setKeyword }) {
</Grid>
</Box>
<Box>
<Grid container spacing={2} columns={12}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
size="small"
fullWidth
name="textStyle"
value={textStyle}
label={i18n("text_style")}
disabled={disabled}
onChange={handleChange}
>
{GlobalItem}
{OPT_STYLE_ALL.map((item) => (
<MenuItem key={item} value={item}>
{i18n(item)}
</MenuItem>
))}
</TextField>
</Grid>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
size="small"
fullWidth
name="bgColor"
value={bgColor}
label={i18n("bg_color")}
disabled={disabled}
onChange={handleChange}
/>
</Grid>
</Grid>
</Box>
{textStyle === OPT_STYLE_DIY && (
<TextField
size="small"
label={i18n("diy_style")}
helperText={i18n("diy_style_helper")}
name="textDiyStyle"
value={textDiyStyle}
disabled={disabled}
onChange={handleChange}
maxRows={10}
multiline
/>
)}
{showMore && (
<>
{/* <TextField
size="small"
label={i18n("fixer_selector")}
name="fixerSelector"
value={fixerSelector}
disabled={disabled}
onChange={handleChange}
multiline
maxRows={10}
/>
<TextField
select
size="small"
name="fixerFunc"
value={fixerFunc}
label={i18n("fixer_function")}
helperText={i18n("fixer_function_helper")}
disabled={disabled}
onChange={handleChange}
>
{GlobalItem}
{FIXER_ALL.map((item) => (
<MenuItem key={item} value={item}>
{item}
</MenuItem>
))}
</TextField> */}
<TextField
select
size="small"

View File

@@ -1,12 +1,8 @@
import Box from "@mui/material/Box";
import Stack from "@mui/material/Stack";
import InputLabel from "@mui/material/InputLabel";
import TextField from "@mui/material/TextField";
import MenuItem from "@mui/material/MenuItem";
import FormControl from "@mui/material/FormControl";
import Select from "@mui/material/Select";
import Link from "@mui/material/Link";
import FormHelperText from "@mui/material/FormHelperText";
import { useSetting } from "../../hooks/Setting";
import { limitNumber } from "../../libs/utils";
import { useI18n } from "../../hooks/I18n";
@@ -102,7 +98,7 @@ export default function Settings() {
const handleImport = async (data) => {
try {
await updateSetting(JSON.parse(data));
updateSetting(JSON.parse(data));
} catch (err) {
kissLog("import setting", err);
}
@@ -121,6 +117,7 @@ export default function Settings() {
csplist = DEFAULT_CSPLIST.join(",\n"),
transInterval = 100,
langDetector = OPT_TRANS_MICROSOFT,
preInit = true,
} = setting;
const { isHide = false, fabClickAction = 0 } = fab || {};
@@ -142,158 +139,195 @@ export default function Settings() {
/>
</Stack>
<FormControl size="small">
<InputLabel>{i18n("ui_lang")}</InputLabel>
<Select
name="uiLang"
value={uiLang}
label={i18n("ui_lang")}
onChange={handleChange}
>
{UI_LANGS.map(([lang, name]) => (
<MenuItem key={lang} value={lang}>
{name}
</MenuItem>
))}
</Select>
</FormControl>
<TextField
size="small"
label={i18n("min_translate_length")}
type="number"
name="minLength"
value={minLength}
onChange={handleChange}
/>
<TextField
size="small"
label={i18n("max_translate_length")}
type="number"
name="maxLength"
value={maxLength}
onChange={handleChange}
/>
<TextField
size="small"
label={i18n("num_of_newline_characters")}
type="number"
name="newlineLength"
value={newlineLength}
onChange={handleChange}
/>
<TextField
size="small"
label={i18n("translate_interval")}
type="number"
name="transInterval"
value={transInterval}
onChange={handleChange}
/>
<TextField
size="small"
label={i18n("http_timeout")}
type="number"
name="httpTimeout"
value={httpTimeout}
onChange={handleChange}
/>
<FormControl size="small">
<InputLabel>{i18n("touch_translate_shortcut")}</InputLabel>
<Select
name="touchTranslate"
value={touchTranslate}
label={i18n("touch_translate_shortcut")}
onChange={handleChange}
>
{[0, 2, 3, 4].map((item) => (
<MenuItem key={item} value={item}>
{i18n(`touch_tap_${item}`)}
</MenuItem>
))}
</Select>
</FormControl>
<FormControl size="small">
<InputLabel>{i18n("hide_fab_button")}</InputLabel>
<Select
name="isHide"
value={isHide}
label={i18n("hide_fab_button")}
onChange={(e) => {
updateFab({ isHide: e.target.value });
}}
>
<MenuItem value={false}>{i18n("show")}</MenuItem>
<MenuItem value={true}>{i18n("hide")}</MenuItem>
</Select>
</FormControl>
<FormControl size="small">
<InputLabel>{i18n("fab_click_action")}</InputLabel>
<Select
name="fabClickAction"
value={fabClickAction}
label={i18n("fab_click_action")}
onChange={(e) => updateFab({ fabClickAction: e.target.value })}
>
<MenuItem value={0}>{i18n("fab_click_menu")}</MenuItem>
<MenuItem value={1}>{i18n("fab_click_translate")}</MenuItem>
</Select>
</FormControl>
<FormControl size="small">
<InputLabel>{i18n("context_menus")}</InputLabel>
<Select
name="contextMenuType"
value={contextMenuType}
label={i18n("context_menus")}
onChange={handleChange}
>
<MenuItem value={0}>{i18n("hide_context_menus")}</MenuItem>
<MenuItem value={1}>{i18n("simple_context_menus")}</MenuItem>
<MenuItem value={2}>{i18n("secondary_context_menus")}</MenuItem>
</Select>
</FormControl>
<FormControl size="small">
<InputLabel>{i18n("detect_lang_remote")}</InputLabel>
<Select
name="langDetector"
value={langDetector}
label={i18n("detect_lang_remote")}
onChange={handleChange}
>
{OPT_LANGDETECTOR_ALL.map((item) => (
<MenuItem value={item} key={item}>
{item}
</MenuItem>
))}
</Select>
</FormControl>
<Box>
<Grid container spacing={2} columns={12}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
fullWidth
size="small"
name="uiLang"
value={uiLang}
label={i18n("ui_lang")}
onChange={handleChange}
>
{UI_LANGS.map(([lang, name]) => (
<MenuItem key={lang} value={lang}>
{name}
</MenuItem>
))}
</TextField>
</Grid>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
fullWidth
size="small"
name="preInit"
value={preInit}
label={i18n("if_pre_init")}
onChange={handleChange}
>
<MenuItem value={true}>{i18n("enable")}</MenuItem>
<MenuItem value={false}>{i18n("disable")}</MenuItem>
</TextField>
</Grid>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
fullWidth
size="small"
name="isHide"
value={isHide}
label={i18n("hide_fab_button")}
onChange={(e) => {
updateFab({ isHide: e.target.value });
}}
>
<MenuItem value={false}>{i18n("show")}</MenuItem>
<MenuItem value={true}>{i18n("hide")}</MenuItem>
</TextField>
</Grid>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
fullWidth
size="small"
name="fabClickAction"
value={fabClickAction}
label={i18n("fab_click_action")}
onChange={(e) => updateFab({ fabClickAction: e.target.value })}
>
<MenuItem value={0}>{i18n("fab_click_menu")}</MenuItem>
<MenuItem value={1}>{i18n("fab_click_translate")}</MenuItem>
</TextField>
</Grid>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
fullWidth
size="small"
label={i18n("min_translate_length")}
type="number"
name="minLength"
value={minLength}
onChange={handleChange}
/>
</Grid>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
fullWidth
size="small"
label={i18n("max_translate_length")}
type="number"
name="maxLength"
value={maxLength}
onChange={handleChange}
/>
</Grid>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
fullWidth
size="small"
label={i18n("num_of_newline_characters")}
type="number"
name="newlineLength"
value={newlineLength}
onChange={handleChange}
/>
</Grid>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
fullWidth
size="small"
label={i18n("translate_interval")}
type="number"
name="transInterval"
value={transInterval}
onChange={handleChange}
/>
</Grid>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
fullWidth
size="small"
label={i18n("http_timeout")}
type="number"
name="httpTimeout"
value={httpTimeout}
onChange={handleChange}
/>
</Grid>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
fullWidth
size="small"
name="touchTranslate"
value={touchTranslate}
label={i18n("touch_translate_shortcut")}
onChange={handleChange}
>
{[0, 2, 3, 4].map((item) => (
<MenuItem key={item} value={item}>
{i18n(`touch_tap_${item}`)}
</MenuItem>
))}
</TextField>
</Grid>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
fullWidth
size="small"
name="contextMenuType"
value={contextMenuType}
label={i18n("context_menus")}
onChange={handleChange}
>
<MenuItem value={0}>{i18n("hide_context_menus")}</MenuItem>
<MenuItem value={1}>{i18n("simple_context_menus")}</MenuItem>
<MenuItem value={2}>{i18n("secondary_context_menus")}</MenuItem>
</TextField>
</Grid>
<Grid item xs={12} sm={6} md={6} lg={3}>
<TextField
select
fullWidth
size="small"
name="langDetector"
value={langDetector}
label={i18n("detect_lang_remote")}
onChange={handleChange}
>
{OPT_LANGDETECTOR_ALL.map((item) => (
<MenuItem value={item} key={item}>
{item}
</MenuItem>
))}
</TextField>
</Grid>
</Grid>
</Box>
{isExt ? (
<>
<FormControl size="small">
<InputLabel>{i18n("if_clear_cache")}</InputLabel>
<Select
name="clearCache"
value={clearCache}
label={i18n("if_clear_cache")}
onChange={handleChange}
>
<MenuItem value={false}>{i18n("clear_cache_never")}</MenuItem>
<MenuItem value={true}>{i18n("clear_cache_restart")}</MenuItem>
</Select>
<FormHelperText>
<TextField
select
fullWidth
size="small"
name="clearCache"
value={clearCache}
label={i18n("if_clear_cache")}
onChange={handleChange}
helperText={
<Link component="button" onClick={handleClearCache}>
{i18n("clear_all_cache_now")}
</Link>
</FormHelperText>
</FormControl>
}
>
<MenuItem value={false}>{i18n("clear_cache_never")}</MenuItem>
<MenuItem value={true}>{i18n("clear_cache_restart")}</MenuItem>
</TextField>
<TextField
size="small"
@@ -311,25 +345,25 @@ export default function Settings() {
<>
<Box>
<Grid container spacing={2} columns={12}>
<Grid item xs={12} sm={12} md={3} lg={3}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<ShortcutItem
action={OPT_SHORTCUT_TRANSLATE}
label={i18n("toggle_translate_shortcut")}
/>
</Grid>
<Grid item xs={12} sm={12} md={3} lg={3}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<ShortcutItem
action={OPT_SHORTCUT_STYLE}
label={i18n("toggle_style_shortcut")}
/>
</Grid>
<Grid item xs={12} sm={12} md={3} lg={3}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<ShortcutItem
action={OPT_SHORTCUT_POPUP}
label={i18n("toggle_popup_shortcut")}
/>
</Grid>
<Grid item xs={12} sm={12} md={3} lg={3}>
<Grid item xs={12} sm={6} md={6} lg={3}>
<ShortcutItem
action={OPT_SHORTCUT_SETTING}
label={i18n("open_setting_shortcut")}

View File

@@ -2,6 +2,7 @@ import Box from "@mui/material/Box";
import Stack from "@mui/material/Stack";
import TextField from "@mui/material/TextField";
import MenuItem from "@mui/material/MenuItem";
import Grid from "@mui/material/Grid";
import { useI18n } from "../../hooks/I18n";
import {
OPT_LANGS_FROM,
@@ -70,177 +71,222 @@ export default function Tranbox() {
<Box>
<Stack spacing={3}>
<Alert severity="info">{i18n("selected_translation_alert")}</Alert>
<TextField
select
size="small"
name="apiSlug"
value={apiSlug}
label={i18n("translate_service")}
onChange={handleChange}
>
{enabledApis.map((api) => (
<MenuItem key={api.apiSlug} value={api.apiSlug}>
{api.apiName}
</MenuItem>
))}
</TextField>
<TextField
select
size="small"
name="fromLang"
value={fromLang}
label={i18n("from_lang")}
onChange={handleChange}
>
{OPT_LANGS_FROM.map(([lang, name]) => (
<MenuItem key={lang} value={lang}>
{name}
</MenuItem>
))}
</TextField>
<Box>
<Grid container spacing={2} columns={12}>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
select
fullWidth
size="small"
name="apiSlug"
value={apiSlug}
label={i18n("translate_service")}
onChange={handleChange}
>
{enabledApis.map((api) => (
<MenuItem key={api.apiSlug} value={api.apiSlug}>
{api.apiName}
</MenuItem>
))}
</TextField>
</Grid>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
fullWidth
select
size="small"
name="fromLang"
value={fromLang}
label={i18n("from_lang")}
onChange={handleChange}
>
{OPT_LANGS_FROM.map(([lang, name]) => (
<MenuItem key={lang} value={lang}>
{name}
</MenuItem>
))}
</TextField>
</Grid>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
fullWidth
select
size="small"
name="toLang"
value={toLang}
label={i18n("to_lang")}
onChange={handleChange}
>
{OPT_LANGS_TO.map(([lang, name]) => (
<MenuItem key={lang} value={lang}>
{name}
</MenuItem>
))}
</TextField>
</Grid>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
fullWidth
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>
</Grid>
<TextField
select
size="small"
name="toLang"
value={toLang}
label={i18n("to_lang")}
onChange={handleChange}
>
{OPT_LANGS_TO.map(([lang, name]) => (
<MenuItem key={lang} value={lang}>
{name}
</MenuItem>
))}
</TextField>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
fullWidth
select
size="small"
name="enDict"
value={enDict}
label={i18n("english_dict")}
onChange={handleChange}
>
<MenuItem value={"-"}>{i18n("disable")}</MenuItem>
<MenuItem value={OPT_DICT_BAIDU}>{OPT_DICT_BAIDU}</MenuItem>
</TextField>
</Grid>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
fullWidth
select
size="small"
name="triggerMode"
value={triggerMode}
label={i18n("trigger_mode")}
onChange={handleChange}
>
{OPT_TRANBOX_TRIGGER_ALL.map((item) => (
<MenuItem key={item} value={item}>
{i18n(`trigger_${item}`)}
</MenuItem>
))}
</TextField>
</Grid>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
fullWidth
select
size="small"
name="hideTranBtn"
value={hideTranBtn}
label={i18n("hide_tran_button")}
onChange={handleChange}
>
<MenuItem value={false}>{i18n("show")}</MenuItem>
<MenuItem value={true}>{i18n("hide")}</MenuItem>
</TextField>
</Grid>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
fullWidth
select
size="small"
name="hideClickAway"
value={hideClickAway}
label={i18n("hide_click_away")}
onChange={handleChange}
>
<MenuItem value={false}>{i18n("disable")}</MenuItem>
<MenuItem value={true}>{i18n("enable")}</MenuItem>
</TextField>
</Grid>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
fullWidth
select
size="small"
name="simpleStyle"
value={simpleStyle}
label={i18n("use_simple_style")}
onChange={handleChange}
>
<MenuItem value={false}>{i18n("disable")}</MenuItem>
<MenuItem value={true}>{i18n("enable")}</MenuItem>
</TextField>
</Grid>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
fullWidth
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>
</Grid>
<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
select
size="small"
name="enDict"
value={enDict}
label={i18n("english_dict")}
onChange={handleChange}
>
<MenuItem value={"-"}>{i18n("disable")}</MenuItem>
<MenuItem value={OPT_DICT_BAIDU}>{OPT_DICT_BAIDU}</MenuItem>
</TextField>
<TextField
size="small"
label={i18n("tranbtn_offset_x")}
type="number"
name="btnOffsetX"
value={btnOffsetX}
onChange={handleChange}
/>
<TextField
size="small"
label={i18n("tranbtn_offset_y")}
type="number"
name="btnOffsetY"
value={btnOffsetY}
onChange={handleChange}
/>
<TextField
size="small"
label={i18n("tranbox_offset_x")}
type="number"
name="boxOffsetX"
value={boxOffsetX}
onChange={handleChange}
/>
<TextField
size="small"
label={i18n("tranbox_offset_y")}
type="number"
name="boxOffsetY"
value={boxOffsetY}
onChange={handleChange}
/>
<TextField
select
size="small"
name="hideTranBtn"
value={hideTranBtn}
label={i18n("hide_tran_button")}
onChange={handleChange}
>
<MenuItem value={false}>{i18n("show")}</MenuItem>
<MenuItem value={true}>{i18n("hide")}</MenuItem>
</TextField>
<TextField
select
size="small"
name="hideClickAway"
value={hideClickAway}
label={i18n("hide_click_away")}
onChange={handleChange}
>
<MenuItem value={false}>{i18n("disable")}</MenuItem>
<MenuItem value={true}>{i18n("enable")}</MenuItem>
</TextField>
<TextField
select
size="small"
name="simpleStyle"
value={simpleStyle}
label={i18n("use_simple_style")}
onChange={handleChange}
>
<MenuItem value={false}>{i18n("disable")}</MenuItem>
<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"
name="triggerMode"
value={triggerMode}
label={i18n("trigger_mode")}
onChange={handleChange}
>
{OPT_TRANBOX_TRIGGER_ALL.map((item) => (
<MenuItem key={item} value={item}>
{i18n(`trigger_${item}`)}
</MenuItem>
))}
</TextField>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
fullWidth
size="small"
label={i18n("tranbtn_offset_x")}
type="number"
name="btnOffsetX"
value={btnOffsetX}
onChange={handleChange}
/>
</Grid>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
fullWidth
size="small"
label={i18n("tranbtn_offset_y")}
type="number"
name="btnOffsetY"
value={btnOffsetY}
onChange={handleChange}
/>
</Grid>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
fullWidth
size="small"
label={i18n("tranbox_offset_x")}
type="number"
name="boxOffsetX"
value={boxOffsetX}
onChange={handleChange}
/>
</Grid>
<Grid item xs={12} sm={12} md={6} lg={3}>
<TextField
fullWidth
size="small"
label={i18n("tranbox_offset_y")}
type="number"
name="boxOffsetY"
value={boxOffsetY}
onChange={handleChange}
/>
</Grid>
{!isExt && (
<Grid item xs={12} sm={12} md={6} lg={3}>
<ShortcutInput
value={tranboxShortcut}
onChange={handleShortcutInput}
label={i18n("trigger_tranbox_shortcut")}
/>
</Grid>
)}
</Grid>
</Box>
<TextField
size="small"
@@ -251,14 +297,6 @@ export default function Tranbox() {
maxRows={10}
multiline
/>
{!isExt && (
<ShortcutInput
value={tranboxShortcut}
onChange={handleShortcutInput}
label={i18n("trigger_tranbox_shortcut")}
/>
)}
</Stack>
</Box>
);