111 lines
3.3 KiB
JavaScript
111 lines
3.3 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 {
|
|
getSettingWithDefault,
|
|
getRulesWithDefault,
|
|
getFabWithDefault,
|
|
} from "./libs/storage";
|
|
import { Translator } from "./libs/translator";
|
|
import { trySyncAllSubRules } from "./libs/subRules";
|
|
import { MSG_TRANS_TOGGLE, MSG_TRANS_PUTRULE } from "./config";
|
|
import { isIframe } from "./libs/iframe";
|
|
import { handlePing, injectScript } from "./libs/gm";
|
|
import { matchRule } from "./libs/rules";
|
|
import { genEventName } from "./libs/utils";
|
|
import { webfix } from "./libs/webfix";
|
|
|
|
/**
|
|
* 入口函数
|
|
*/
|
|
const init = 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)
|
|
) {
|
|
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);
|
|
}
|
|
|
|
return;
|
|
}
|
|
|
|
// 翻译页面
|
|
const href = isIframe ? document.referrer : document.location.href;
|
|
const setting = await getSettingWithDefault();
|
|
const rules = await getRulesWithDefault();
|
|
const rule = await matchRule(rules, href, setting);
|
|
const translator = new Translator(rule, setting);
|
|
webfix(href, 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 getFabWithDefault();
|
|
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>
|
|
);
|
|
|
|
// 同步订阅规则
|
|
trySyncAllSubRules(setting);
|
|
};
|
|
|
|
(async () => {
|
|
try {
|
|
await init();
|
|
} catch (err) {
|
|
console.error("[KISS-Translator]", err);
|
|
const $err = document.createElement("div");
|
|
$err.innerText = `KISS-Translator: ${err.message}`;
|
|
$err.style.cssText = "background:red; color:#fff;";
|
|
document.body.prepend($err);
|
|
}
|
|
})();
|