mirror of
https://ghfast.top/https://github.com/StarCitizenToolBox/StarCitizenBoxBrowserEx.git
synced 2025-05-10 14:11:23 +08:00
ebf6447507
* feat: 为chrome拓展添加手动调用翻译的功能
* feat: add SC-BOX-TRANSLATE-API-AVAILABLE message
* refactor: move content script logic to core.js
* feat: add context menu for translating pages
* chore: 🤖 使用extension.js
* chore: update package metadata
* chore: ensure context menu creation on extension install
* feat: add toggle translation functionality
* feat: add support for dynamic localization based on tab URL
* feat: add Chinese translation for Star Citizen browser extension
* docs: update README with new API usage instructions
* refactor: update translation logic to append original values
* typescript support
* feat: add manual URL handling for localization
* feat: add postMessage for toggling SC-BOX translate
* feat: add translation toggle event to postMessage
* feat: add translation status and message handling
* refactor: optimize localization version logging
105 lines
3.2 KiB
Markdown
105 lines
3.2 KiB
Markdown
# 星际公民盒子 浏览器拓展
|
||
|
||
为您将星际公民官网及常用工具网站翻译为中文的浏览器拓展，所有翻译内容来自 星际公民中文社区汉化组。
|
||
本插件也内置于 [星际公民盒子](https://github.com/xkeyC/StarCitizenToolBox) 。
|
||
|
||
SC网站翻译项目：[CxJuice/ScWeb_Chinese_Translate](https://github.com/CxJuice/ScWeb_Chinese_Translate)
|
||
|
||
## **本插件仅供大致浏览使用，不对任何有关本插件产生的问题负责！在涉及账号操作前请注意确认网站的原本内容！**
|
||
|
||
|
||
|
||
## 安装
|
||
|
||
[Google Chrome 应用商店](https://chrome.google.com/webstore/detail/gocnjckojmledijgmadmacoikibcggja?authuser=0&hl=zh-CN)
|
||
|
||
[Microsoft Edge 加载项（因微软审核较慢，可能存在版本滞后，推荐优先使用 Chrome 源）](https://microsoftedge.microsoft.com/addons/detail/lipbbcckldklpdcpfagicipecaacikgi)
|
||
|
||
[Firefox ADD-ONS](https://addons.mozilla.org/zh-CN/firefox/addon/%E6%98%9F%E9%99%85%E5%85%AC%E6%B0%91%E7%9B%92%E5%AD%90%E6%B5%8F%E8%A7%88%E5%99%A8%E6%8B%93%E5%B1%95/)
|
||
|
||
## 手动安装
|
||
|
||
下载 zip 后使用插件的开发者功能手动安装 dist/chrome 文件夹 Firefox 安装 dist/firefox 文件夹。
|
||
|
||
### 开发者
|
||
|
||
#### 调用翻译Hook
|
||
|
||
```tsx
|
||
enum SCBoxTranslateStatus {
|
||
Available,
|
||
Translated,
|
||
NotAvailable,
|
||
}
|
||
|
||
const [translateApiAvailable, setTranslateApiAvailable] = useState<SCBoxTranslateStatus>(SCBoxTranslateStatus.NotAvailable);
|
||
|
||
useEffect(() => {
|
||
function handleMessage(event: MessageEvent) {
|
||
if (event.source !== window) return;
|
||
// 在插件加载后会向页面发送消息
|
||
if (event.data?.type === 'SC-BOX-TRANSLATE-API-AVAILABLE') {
|
||
setTranslateApiAvailable(SCBoxTranslateStatus.Available);
|
||
}
|
||
// 在翻译状态改变时插件也会向页面发送消息
|
||
if (event.data?.type === 'TOGGLED-SC-BOX-TRANSLATE') {
|
||
switch (event.data.action) {
|
||
case 'on':
|
||
setTranslateApiAvailable(SCBoxTranslateStatus.Translated);
|
||
return;
|
||
case 'off':
|
||
setTranslateApiAvailable(SCBoxTranslateStatus.Available);
|
||
return;
|
||
}
|
||
}
|
||
}
|
||
|
||
window.addEventListener('message', handleMessage);
|
||
return () => window.removeEventListener('message', handleMessage);
|
||
}, []);
|
||
```
|
||
|
||
```ts
|
||
// 触发翻译
|
||
window.postMessage({
|
||
type: 'SC_TRANSLATE_REQUEST',
|
||
action: 'translate',
|
||
requestId: Math.random().toString(36)
|
||
}, '*');
|
||
|
||
// 撤销翻译
|
||
window.postMessage({
|
||
type: 'SC_TRANSLATE_REQUEST',
|
||
action: 'undoTranslate',
|
||
requestId: Math.random().toString(36)
|
||
}, '*');
|
||
```
|
||
|
||
#### 开发/调试
|
||
|
||
##### 安装依赖
|
||
|
||
```bash
|
||
pnpm install
|
||
```
|
||
|
||
##### 开发模式
|
||
|
||
此命令在开发模式下运行您的扩展程序。它将启动一个新的浏览器实例，加载您的扩展程序。每当您对代码进行更改时，页面将自动重新加载，从而提供流畅的开发体验。
|
||
|
||
```bash
|
||
pnpm dev
|
||
# firefox
|
||
pnpm dev:firefox
|
||
```
|
||
|
||
##### 编译
|
||
|
||
此命令用于为生产环境构建您的扩展程序。它会优化和打包您的扩展程序，准备好部署到目标浏览器的商店。
|
||
|
||
```bash
|
||
pnpm build
|
||
# firefox
|
||
pnpm build:firefox
|
||
```
|