96 lines
2.6 KiB
JavaScript
96 lines
2.6 KiB
JavaScript
import React from "react";
|
|
import ReactDOM from "react-dom/client";
|
|
import Action from "./views/Action";
|
|
import createCache from "@emotion/cache";
|
|
import { CacheProvider } from "@emotion/react";
|
|
import { getSetting, getRules, matchRule, getFab } from "./libs";
|
|
import { Translator } from "./libs/translator";
|
|
import { trySyncAllSubRules } from "./libs/rules";
|
|
import { isGm } from "./libs/browser";
|
|
import { MSG_TRANS_TOGGLE, MSG_TRANS_PUTRULE } from "./config";
|
|
import { isIframe } from "./libs/iframe";
|
|
|
|
/**
|
|
* 入口函数
|
|
*/
|
|
(async () => {
|
|
// 设置页面
|
|
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)
|
|
) {
|
|
unsafeWindow.GM = GM;
|
|
unsafeWindow.APP_NAME = process.env.REACT_APP_NAME;
|
|
return;
|
|
}
|
|
|
|
// 翻译页面
|
|
const href = isIframe ? document.referrer : document.location.href;
|
|
const setting = await getSetting();
|
|
const rules = await getRules();
|
|
const rule = await matchRule(rules, href, setting);
|
|
const translator = new Translator(rule, setting);
|
|
|
|
if (isIframe) {
|
|
// iframe
|
|
window.addEventListener("message", (e) => {
|
|
const action = e?.data?.action;
|
|
switch (action) {
|
|
case MSG_TRANS_TOGGLE:
|
|
translator.toggle();
|
|
break;
|
|
case MSG_TRANS_PUTRULE:
|
|
translator.updateRule(e.data.args || {});
|
|
break;
|
|
default:
|
|
}
|
|
});
|
|
return;
|
|
}
|
|
|
|
// 浮球按钮
|
|
const fab = await getFab();
|
|
const $action = document.createElement("div");
|
|
$action.setAttribute("id", "kiss-translator");
|
|
document.body.parentElement.appendChild($action);
|
|
const shadowContainer = $action.attachShadow({ mode: "closed" });
|
|
const emotionRoot = document.createElement("style");
|
|
const shadowRootElement = document.createElement("div");
|
|
shadowContainer.appendChild(emotionRoot);
|
|
shadowContainer.appendChild(shadowRootElement);
|
|
const cache = createCache({
|
|
key: "css",
|
|
prepend: true,
|
|
container: emotionRoot,
|
|
});
|
|
ReactDOM.createRoot(shadowRootElement).render(
|
|
<React.StrictMode>
|
|
<CacheProvider value={cache}>
|
|
<Action translator={translator} fab={fab} />
|
|
</CacheProvider>
|
|
</React.StrictMode>
|
|
);
|
|
|
|
// 注册菜单
|
|
if (isGm) {
|
|
GM.registerMenuCommand(
|
|
"Toggle Translate",
|
|
(event) => {
|
|
translator.toggle();
|
|
},
|
|
"Q"
|
|
);
|
|
GM.registerMenuCommand(
|
|
"Toggle Style",
|
|
(event) => {
|
|
translator.toggleStyle();
|
|
},
|
|
"C"
|
|
);
|
|
}
|
|
|
|
// 同步订阅规则
|
|
trySyncAllSubRules(setting);
|
|
})();
|