release v0.3.0

- 新增字幕字体粗细、文本阴影等设置选项 - 更新相关文档，增加新功能说明 - 修复系统主题载入颜色bug
Merge pull request #6 from HiMeditator/mac-adaption
2026-02-04 12:24:42 +08:00 · 2025-07-09 01:33:21 +08:00 · 2025-07-08 22:46:51 +08:00 · 2025-07-08 22:44:11 +08:00 · 2025-07-08 21:05:43 +08:00 · 2025-07-08 17:04:15 +08:00
104 changed files with 4136 additions and 1371 deletions
--- a/.editorconfig
+++ b/.editorconfig
@@ -6,4 +6,10 @@ indent_style = space
 indent_size = 2
 end_of_line = lf
 insert_final_newline = true
-trim_trailing_whitespace = true
+trim_trailing_whitespace = true
+
+[*.py]
+indent_size = 4
+
+[*.ipynb]
+indent_size = 4
--- a/.gitignore
+++ b/.gitignore
@@ -6,4 +6,6 @@ out
 *.log*
 __pycache__
 subenv
-python-subprocess/build
+caption-engine/build
+output.wav
+.venv
--- a/.npmrc
+++ b/.npmrc
@@ -1,2 +1,2 @@
-electron_mirror=https://npmmirror.com/mirrors/electron/
-electron_builder_binaries_mirror=https://npmmirror.com/mirrors/electron-builder-binaries/
+# electron_mirror=https://npmmirror.com/mirrors/electron/
+# electron_builder_binaries_mirror=https://npmmirror.com/mirrors/electron-builder-binaries/
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -7,5 +7,8 @@
  },
  "[json]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
-  }
+  },
+  "python.analysis.extraPaths": [
+    "./caption-engine"
+  ]
 }
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,22 +0,0 @@
-## v0.0.1
-
-2025-06-22
-
-发布第一版软件。
-
-## v0.1.0
-
-2025-06-26
-
-### 新增功能
-
- 添加错误通知
- 添加默认引擎的环境变量检查
- 添加配置数据文件保存和载入
- 添加字幕样式恢复默认的选项
- 添加项目关于信息
-
-### 新增文档
-
- 添加用户说明文档
- 添加字幕引擎说明文档
--- a/README.md
+++ b/README.md
@@ -1,43 +1,101 @@
 <div align="center" >
-    <img src="./resources/icon.png" width="100px" height="100px"/>
+    <img src="./build/icon.png" width="100px" height="100px"/>
    <h1 align="center">auto-caption</h1>
    <p>Auto Caption 是一个跨平台的实时字幕显示软件。</p>
+    <img src="https://img.shields.io/badge/version-0.3.0-blue">
+    <img src="https://img.shields.io/github/issues/HiMeditator/auto-caption?color=orange">
+    <img src="https://img.shields.io/github/languages/top/HiMeditator/auto-caption?color=royalblue">
+    <img src="https://img.shields.io/github/repo-size/HiMeditator/auto-caption?color=green">
+    <img src="https://visitor-badge.laobi.icu/badge?page_id=himeditator.github.io">
    <p>
        | <b>简体中文</b>
-        | <a href="https://github.com/HiMeditator/auto-caption/blob/main/README_en.md">English</a> |
+        | <a href="./README_en.md">English</a>
+        | <a href="./README_ja.md">日本語</a> |
    </p>
+    <p><i>v0.3.0版本已经发布。预计将添加本地字幕引擎的v1.0.0版本仍正在开发中...</i></p>
 </div>

-![](./assets/media/main.png)
+![](./assets/media/main_zh.png)

 ## 📥 下载

 [GitHub Releases](https://github.com/HiMeditator/auto-caption/releases)

-## 📚 用户手册
+## 📚 相关文档

-[Auto Caption 用户手册](./assets/user-manual_zh.md)
+[Auto Caption 用户手册](./docs/user-manual/zh.md)

-[字幕引擎说明文档](./assets/engine-manual_zh.md)
+[字幕引擎说明文档](./docs/engine-manual/zh.md)

-### 基本使用
+[项目 API 文档](./docs/api-docs/electron-ipc.md)

-目前仅提供了 Windows 平台的可安装版本。如果使用默认的 Gummy 字幕引擎，需要获取阿里云百炼平台的 API KEY 并配置到环境变量中才能正常使用该模型。相关教程：[获取 API KEY](https://help.aliyun.com/zh/model-studio/get-api-key)、[将 API Key 配置到环境变量](https://help.aliyun.com/zh/model-studio/configure-api-key-through-environment-variables)。
+## 📖 基本使用

-对于开发者，可以自己开发新的字幕引擎，自定义字幕引擎的开发请参考[字幕引擎说明文档](./assets/engine-manual_zh.md)。
+目前提供了 Windows 和 macOS 平台的可安装版本。如果要使用默认的 Gummy 字幕引擎，首先需要获取阿里云百炼平台的 API KEY，然后将 API KEY 添加到软件设置中或者配置到环境变量中（仅 Windows 平台支持读取环境变量中的 API KEY），这样才能正常使用该模型。
+
+![](./assets/media/api_zh.png)
+
+**国际版的阿里云服务并没有提供 Gummy 模型，因此目前非中国用户无法使用默认字幕引擎。我正在开发新的本地字幕引擎，以确保所有用户都有默认字幕引擎可以使用。**
+
+相关教程：
+
+- [获取 API KEY](https://help.aliyun.com/zh/model-studio/get-api-key)
+- [将 API Key 配置到环境变量](https://help.aliyun.com/zh/model-studio/configure-api-key-through-environment-variables)
+
+如果你想了解字幕引擎的工作原理，或者你想开发自己的字幕引擎，请参考[字幕引擎说明文档](./docs/engine-manual/zh.md)。
 ## ✨ 特性

+- 跨平台、多界面语言支持
 - 丰富的字幕样式设置
 - 灵活的字幕引擎选择
 - 多语言识别与翻译
 - 字幕记录展示与导出
- 生成音频输出和麦克风输入的字幕
+- 生成音频输出或麦克风输入的字幕

-说明：Windows 平台支持生成音频输出和麦克风输入的字幕，Linux 平台仅支持生成麦克风输入的字幕。
+说明：
+- Windows 和 macOS 平台支持生成音频输出和麦克风输入的字幕，但是 **macOS 平台获取系统音频输出需要进行设置，详见[Auto Caption 用户手册](./docs/user-manual/zh.md)**
+- Linux 平台目前无法获取系统音频输出，仅支持生成麦克风输入的字幕
+
+## ⚙️ 自带字幕引擎说明
+
+目前软件自带 1 个字幕引擎，正在规划 2 个新的引擎。它们的详细信息如下。
+
+### Gummy 字幕引擎（云端）
+
+基于通义实验室[Gummy语音翻译大模型](https://help.aliyun.com/zh/model-studio/gummy-speech-recognition-translation/)进行开发，基于[阿里云百炼](https://bailian.console.aliyun.com)的 API 进行调用该云端模型。
+
+**模型详细参数：**
+
+- 音频采样率支持：16kHz及以上
+- 音频采样位数：16bit
+- 音频通道数支持：单通道
+- 可识别语言：中文、英文、日语、韩语、德语、法语、俄语、意大利语、西班牙语
+- 支持的翻译：
+  - 中文 → 英文、日语、韩语
+  - 英文 → 中文、日语、韩语
+  - 日语、韩语、德语、法语、俄语、意大利语、西班牙语 → 中文或英文
+
+**网络流量消耗：**
+
+字幕引擎使用原生采样率（假设为 48kHz）进行采样，样本位深为 16bit，上传音频为为单通道，因此上传速率约为：
+
+$$
+48000\ \text{samples/second} \times 2\ \text{bytes/sample} \times 1\ \text{channel}  = 93.75\ \text{KB/s}
+$$
+
+而且引擎只会获取到音频流的时候才会上传数据，因此实际上传速率可能更小。模型结果回传流量消耗较小，没有纳入考虑。
+
+### Vosk 字幕引擎（本地）
+
+预计基于 [vosk-api](https://github.com/alphacep/vosk-api) 进行开发，正在实验中。
+
+### FunASR 字幕引擎（本地）
+
+如果可行，将基于 [FunASR](https://github.com/modelscope/FunASR) 进行开发。还未进行调研和可行性验证。

 ## 🚀 项目运行

-![](./assets/media/structure.png)
+![](./assets/media/structure_zh.png)

 ### 安装依赖

@@ -47,20 +105,13 @@ npm install

 ### 构建字幕引擎

-> #### 背景介绍
->
-> 如果你是开发者，想开发自定义字幕引擎，请查看[字幕引擎说明文档](./assets/engine-manual_zh.md)。
-> 
-> 所谓的字幕引擎实际上是一个子程序，它会实时获取系统音频输入（录音）或输出（播放声音）的流式数据，并调用音频转文字的模型生成对应音频的字幕。生成的字幕通过 IPC 输出为转换为字符串的 JSON 数据，并返回给主程序。主程序读取字幕数据，处理后显示在窗口上。
->
->目前项目默认使用[阿里云 Gummy 模型](https://help.aliyun.com/zh/model-studio/gummy-speech-recognition-translation/)，需要获取阿里云百炼平台的 API KEY 并配置到环境变量中才能正常使用该模型。
->
-> 本项目的 gummy 字幕引擎是一个 python 子程序，通过 pyinstaller 打包为可执行文件。 运行字幕引擎子程序的代码在 `src\main\utils\engine.ts` 文件中。
-
-首先进入 `python-subprocess` 文件夹，执行如下指令创建虚拟环境：
+首先进入 `caption-engine` 文件夹，执行如下指令创建虚拟环境：

 ```bash
+# in ./caption-engine folder
 python -m venv subenv
+# or
+python3 -m venv subenv
 ```

 然后激活虚拟环境：
@@ -68,11 +119,13 @@ python -m venv subenv
 ```bash
 # Windows
 subenv/Scripts/activate
-# Linux
+# Linux or macOS
 source subenv/bin/activate
 ```

-然后安装依赖（注意如果是 Linux 环境，需要注释调 `requirements.txt` 中的 `PyAudioWPatch`，该模块仅适用于 Windows 环境）：
+然后安装依赖（注意如果是 Linux 或 macOS 环境，需要注释掉 `requirements.txt` 中的 `PyAudioWPatch`，该模块仅适用于 Windows 环境）。
+
+> 这一步可能会报错，一般是因为构建失败，需要根据报错信息安装对应的构建工具包。

 ```bash
 pip install -r requirements.txt
@@ -84,7 +137,7 @@ pip install -r requirements.txt
 pyinstaller --onefile main-gummy.py
 ```

-此时项目构建完成，在进入 `python-subprocess/dist` 文件夹可见对应的可执行文件。即可进行后续操作。
+此时项目构建完成，在进入 `caption-engine/dist` 文件夹可见对应的可执行文件。即可进行后续操作。

 ### 运行项目

@@ -93,7 +146,7 @@ npm run dev
 ```
 ### 构建项目

-注意目前软件没有适配 macOS 平台，请使用 Windows 或 Linux 系统进行构建，更建议使用实现了完整功能的 Windows 平台。
+注意目前软件只在 Windows 和 macOS 平台上进行了构建和测试，无法保证软件在 Linux 平台下的正确性。

 ```bash
 # For windows
--- a/README_en.md
+++ b/README_en.md
@@ -1,49 +1,102 @@
 <div align="center" >
-    <img src="./resources/icon.png" width="100px" height="100px"/>
+    <img src="./build/icon.png" width="100px" height="100px"/>
    <h1 align="center">auto-caption</h1>
-    <p>Auto Caption is a cross-platform real-time subtitle display software.</p>
+    <p>Auto Caption is a cross-platform real-time caption display software.</p>
+    <img src="https://img.shields.io/badge/version-0.3.0-blue">
+    <img src="https://img.shields.io/github/issues/HiMeditator/auto-caption?color=orange">
+    <img src="https://img.shields.io/github/languages/top/HiMeditator/auto-caption?color=royalblue">
+    <img src="https://img.shields.io/github/repo-size/HiMeditator/auto-caption?color=green">
+    <img src="https://visitor-badge.laobi.icu/badge?page_id=himeditator.github.io">
    <p>
-        | <a href="https://github.com/HiMeditator/auto-caption/blob/main/README.md">简体中文</a>
-        | <b>English</b> |
+        | <a href="./README.md">简体中文</a>
+        | <b>English</b>
+        | <a href="./README_ja.md">日本語</a> |
    </p>
+    <p><i>Version v0.3.0 has been released. Version v1.0.0, which is expected to add a local caption engine, is still under development...</i></p>
 </div>

-![](./assets/media/main.png)
-
-## ⚠️ Attention
-
-**The current software interface language is Chinese. English adaptation has not been done yet.**
+![](./assets/media/main_en.png)

 ## 📥 Download

 [GitHub Releases](https://github.com/HiMeditator/auto-caption/releases)

-## 📚 User Manual
+## 📚 Documentation

-[Auto Caption User Manual (Chinese)](./assets/user-manual_en.md)
+[Auto Caption User Manual](./docs/user-manual/en.md)

-[Caption Engine Documentation (Chinese)](./assets/engine-manual_en.md)
+[Caption Engine Documentation](./docs/engine-manual/en.md)

-### Basic Usage
+[Project API Documentation (Chinese)](./docs/api-docs/electron-ipc.md)

-Currently, only an installable version for the Windows platform is provided. If using the default Gummy subtitle engine, you need to obtain an API KEY from Alibaba Cloud's Bailian platform and configure it in the environment variables to use the model properly. Related tutorials: [Get API KEY](https://help.aliyun.com/zh/model-studio/get-api-key), [Configure API Key through Environment Variables](https://help.aliyun.com/zh/model-studio/configure-api-key-through-environment-variables).
+## 📖 Basic Usage

-For developers, you can create a new subtitle engine. For instructions on customizing the subtitle engine, please refer to the [Caption Engine Documentation (Chinese)](./assets/engine-manual_zh.md).
+Currently, installable versions are provided for Windows and macOS platforms. To use the default Gummy caption engine, you first need to obtain an API KEY from Alibaba Cloud Bailian platform, then add the API KEY to the software settings or configure it in environment variables (only Windows platform supports reading API KEY from environment variables) to enable normal usage of this model.

+![](./assets/media/api_en.png)
+
+**The international version of Alibaba Cloud services does not provide the Gummy model, so currently non-Chinese users cannot use the default caption engine. I'm developing a new local caption engine to ensure all users have a default caption engine available.**
+
+Related tutorials:
+
+- [Obtain API KEY (Chinese)](https://help.aliyun.com/zh/model-studio/get-api-key)
+- [Configure API Key in Environment Variables (Chinese)](https://help.aliyun.com/zh/model-studio/configure-api-key-through-environment-variables)
+
+If you want to understand how the caption engine works, or if you want to develop your own caption engine, please refer to [Caption Engine Documentation](./docs/engine-manual/en.md).

 ## ✨ Features

- Rich subtitle style settings
- Flexible subtitle engine selection
+- Cross-platform, multi-language UI support
+- Rich caption style settings
+- Flexible caption engine selection
 - Multi-language recognition and translation
- Subtitle record display and export
- Generate subtitles for audio output and microphone input
+- Caption recording display and export
+- Generate captions for audio output or microphone input

-Note: The Windows platform supports generating subtitles for both audio output and microphone input, while the Linux platform only supports generating subtitles for microphone input.
+Notes:
+- Windows and macOS platforms support generating captions for both audio output and microphone input, but **macOS requires additional setup to capture system audio output. See [Auto Caption User Manual](./docs/user-manual/en.md) for details.**
+- Linux platform currently cannot capture system audio output, only supports generating subtitles for microphone input.

-## 🚀 Project Execution
+## ⚙️ Built-in Subtitle Engines

-![](./assets/media/structure.png)
+Currently, the software comes with 1 subtitle engine, with 2 new engines planned. Details are as follows.
+
+### Gummy Subtitle Engine (Cloud)
+
+Developed based on Tongyi Lab's [Gummy Speech Translation Model](https://help.aliyun.com/zh/model-studio/gummy-speech-recognition-translation/), using [Alibaba Cloud Bailian](https://bailian.console.aliyun.com) API to call this cloud model.
+
+**Model Parameters:**
+
+- Supported audio sample rate: 16kHz and above
+- Audio sample depth: 16bit
+- Supported audio channels: Mono
+- Recognizable languages: Chinese, English, Japanese, Korean, German, French, Russian, Italian, Spanish
+- Supported translations:
+  - Chinese → English, Japanese, Korean
+  - English → Chinese, Japanese, Korean
+  - Japanese, Korean, German, French, Russian, Italian, Spanish → Chinese or English
+
+**Network Traffic Consumption:**
+
+The subtitle engine uses native sample rate (assumed to be 48kHz) for sampling, with 16bit sample depth and mono channel, so the upload rate is approximately:
+
+$$
+48000\ \text{samples/second} \times 2\ \text{bytes/sample} \times 1\ \text{channel}  = 93.75\ \text{KB/s}
+$$
+
+The engine only uploads data when receiving audio streams, so the actual upload rate may be lower. The return traffic consumption of model results is small and not considered here.
+
+### Vosk Subtitle Engine (Local)
+
+Planned to be developed based on [vosk-api](https://github.com/alphacep/vosk-api), currently in experimentation.
+
+### FunASR Subtitle Engine (Local)
+
+If feasible, will be developed based on [FunASR](https://github.com/modelscope/FunASR). Not yet researched or verified for feasibility.
+
+## 🚀 Project Setup
+
+![](./assets/media/structure_en.png)

 ### Install Dependencies

@@ -53,20 +106,13 @@ npm install

 ### Build Subtitle Engine

-> #### Background
->
-> If you are a developer and want to develop a custom subtitle engine, please refer to the [Caption Engine Documentation (Chinese)](./assets/engine-manual_zh.md).
->
-> The so-called subtitle engine is actually a subprocess that will real-time acquire streaming data from system audio input (recording) or output (playing sound) and call an audio-to-text model to generate corresponding subtitles for the audio. The generated subtitles are output as JSON data converted to strings via IPC and returned to the main program. The main program reads the subtitle data, processes it, and displays it on the window.
->
-> Currently, the project uses the [Alibaba Cloud Gummy Model](https://help.aliyun.com/zh/model-studio/gummy-speech-recognition-translation/) by default, which requires obtaining an API KEY from Alibaba Cloud's Bailian platform and configuring it in the environment variables to function properly. Related tutorials: [Get API KEY](https://help.aliyun.com/zh/model-studio/get-api-key), [Configure API Key through Environment Variables](https://help.aliyun.com/zh/model-studio/configure-api-key-through-environment-variables).
->
-> The gummy subtitle engine in this project is a Python subprocess, packaged into an executable file using pyinstaller. The code for running the subtitle engine subprocess is in the `src\main\utils\engine.ts` file.
-
-First, enter the `python-subprocess` folder and execute the following command to create a virtual environment:
+First enter the `caption-engine` folder and execute the following commands to create a virtual environment:

 ```bash
+# in ./caption-engine folder
 python -m venv subenv
+# or
+python3 -m venv subenv
 ```

 Then activate the virtual environment:
@@ -74,40 +120,41 @@ Then activate the virtual environment:
 ```bash
 # Windows
 subenv/Scripts/activate
-# Linux
+# Linux or macOS
 source subenv/bin/activate
 ```

-Then install the dependencies (note that if you are in a Linux environment, you need to comment out `PyAudioWPatch` in `requirements.txt`, as this module is only applicable to the Windows environment):
+Then install dependencies (note: for Linux or macOS environments, you need to comment out `PyAudioWPatch` in `requirements.txt`, as this module is only for Windows environments).
+
+> This step may report errors, usually due to build failures. You need to install corresponding build tools based on the error messages.

 ```bash
 pip install -r requirements.txt
 ```

-Then build the project using `pyinstaller`:
+Then use `pyinstaller` to build the project:

 ```bash
 pyinstaller --onefile main-gummy.py
 ```

-At this point, the project is built. You can find the corresponding executable file in the `python-subprocess/dist` folder. You can proceed with further operations.
+After the build completes, you can find the executable file in the `caption-engine/dist` folder. Then proceed with subsequent operations.

-### Run the Project
+### Run Project

 ```bash
 npm run dev
 ```

-### Build the Project
-
-Please note that the software is currently not compatible with the macOS platform. Use Windows or Linux systems for building, with Windows being more recommended as it implements the full set of features.
+### Build Project

+Note: Currently the software has only been built and tested on Windows and macOS platforms. Correct operation on Linux platform is not guaranteed.

 ```bash
-# For Windows
+# For windows
 npm run build:win
 # For macOS
 npm run build:mac
 # For Linux
 npm run build:linux
-```
+```
--- a/README_ja.md
+++ b/README_ja.md
@@ -0,0 +1,158 @@
+<div align="center" >
+    <img src="./build/icon.png" width="100px" height="100px"/>
+    <h1 align="center">auto-caption</h1>
+    <p>Auto Caption はクロスプラットフォームのリアルタイム字幕表示ソフトウェアです。</p>
+    <img src="https://img.shields.io/badge/version-0.3.0-blue">
+    <img src="https://img.shields.io/github/issues/HiMeditator/auto-caption?color=orange">
+    <img src="https://img.shields.io/github/languages/top/HiMeditator/auto-caption?color=royalblue">
+    <img src="https://img.shields.io/github/repo-size/HiMeditator/auto-caption?color=green">
+    <img src="https://visitor-badge.laobi.icu/badge?page_id=himeditator.github.io">
+    <p>
+        | <a href="./README.md">简体中文</a>
+        | <a href="./README_en.md">English</a>
+        | <b>日本語</b> |
+    </p>
+    <p><i>v0.3.0 バージョンがリリースされました。ローカル字幕エンジンを追加予定の v1.0.0 バージョンを現在開発中...</i></p>
+</div>
+
+![](./assets/media/main_ja.png)
+
+## 📥 ダウンロード
+
+[GitHub Releases](https://github.com/HiMeditator/auto-caption/releases)
+
+## 📚 関連ドキュメント
+
+[Auto Caption ユーザーマニュアル](./docs/user-manual/ja.md)
+
+[字幕エンジン説明ドキュメント](./docs/engine-manual/ja.md)
+
+[プロジェクト API ドキュメント（中国語）](./docs/api-docs/electron-ipc.md)
+
+現在、Windows と macOS プラットフォーム向けのインストール可能なバージョンを提供しています。デフォルトの Gummy 字幕エンジンを使用するには、まず Alibaba Cloud Bailian プラットフォームから API KEY を取得し、その API KEY をソフトウェア設定に追加するか、環境変数に設定する必要があります（Windows プラットフォームのみ環境変数からの API KEY 読み取りをサポートしています）。
+
+![](./assets/media/api_ja.png)
+
+**国際版の Alibaba Cloud サービスには Gummy モデルが提供されていないため、現在中国以外のユーザーはデフォルトの字幕エンジンを使用できません。すべてのユーザーがデフォルトの字幕エンジンを使用できるように、新しいローカル字幕エンジンを開発中です。**
+
+関連チュートリアル：
+
+- [API KEY の取得（中国語）](https://help.aliyun.com/zh/model-studio/get-api-key)
+- [環境変数への API Key 設定（中国語）](https://help.aliyun.com/zh/model-studio/configure-api-key-through-environment-variables)
+
+字幕エンジンの動作原理を理解したい場合、または独自の字幕エンジンを開発したい場合は、[字幕エンジン説明ドキュメント](./docs/engine-manual/ja.md)を参照してください。
+
+## ✨ 特徴
+
+- クロスプラットフォーム、多言語 UI サポート
+- 豊富な字幕スタイル設定
+- 柔軟な字幕エンジン選択
+- 多言語認識と翻訳
+- 字幕記録の表示とエクスポート
+- オーディオ出力またはマイク入力からの字幕生成
+
+注記：
+- Windows と macOS プラットフォームはオーディオ出力とマイク入力の両方からの字幕生成をサポートしていますが、**macOS プラットフォームでシステムオーディオ出力を取得するには設定が必要です。詳細は[Auto Caption ユーザーマニュアル](./docs/user-manual/ja.md)をご覧ください。**
+- Linux プラットフォームは現在システムオーディオ出力を取得できず、マイク入力からの字幕生成のみをサポートしています。
+
+## ⚙️ 字幕エンジン説明
+
+現在ソフトウェアには1つの字幕エンジンが組み込まれており、2つの新しいエンジンを計画中です。詳細は以下の通りです。
+
+### Gummy 字幕エンジン（クラウド）
+
+Tongyi Lab の [Gummy 音声翻訳大規模モデル](https://help.aliyun.com/zh/model-studio/gummy-speech-recognition-translation/)をベースに開発され、[Alibaba Cloud Bailian](https://bailian.console.aliyun.com) の APIを使用してこのクラウドモデルを呼び出します。
+
+**モデル詳細パラメータ：**
+
+- サポートするオーディオサンプルレート：16kHz以上
+- オーディオサンプルビット深度：16bit
+- サポートするオーディオチャンネル：モノラル
+- 認識可能な言語：中国語、英語、日本語、韓国語、ドイツ語、フランス語、ロシア語、イタリア語、スペイン語
+- サポートする翻訳：
+  - 中国語 → 英語、日本語、韓国語
+  - 英語 → 中国語、日本語、韓国語
+  - 日本語、韓国語、ドイツ語、フランス語、ロシア語、イタリア語、スペイン語 → 中国語または英語
+
+**ネットワークトラフィック消費量：**
+
+字幕エンジンはネイティブサンプルレート（48kHz と仮定）でサンプリングを行い、サンプルビット深度は 16bit、アップロードオーディオはモノラルチャンネルのため、アップロードレートは約：
+
+$$
+48000\ \text{samples/second} \times 2\ \text{bytes/sample} \times 1\ \text{channel}  = 93.75\ \text{KB/s}
+$$
+
+また、エンジンはオーディオストームを取得したときのみデータをアップロードするため、実際のアップロードレートはさらに小さくなる可能性があります。モデル結果の返信トラフィック消費量は小さく、ここでは考慮していません。
+
+### Vosk字幕エンジン（ローカル）
+
+[vosk-api](https://github.com/alphacep/vosk-api) をベースに開発予定で、現在実験中です。
+
+### FunASR字幕エンジン（ローカル）
+
+可能であれば、[FunASR](https://github.com/modelscope/FunASR) をベースに開発予定です。まだ調査と実現可能性の検証を行っていません。
+
+## 🚀 プロジェクト実行
+
+![](./assets/media/structure_ja.png)
+
+### 依存関係のインストール
+
+```bash
+npm install
+```
+
+### 字幕エンジンの構築
+
+まず `caption-engine` フォルダに入り、以下のコマンドを実行して仮想環境を作成します：
+
+```bash
+# ./caption-engine フォルダ内
+python -m venv subenv
+# または
+python3 -m venv subenv
+```
+
+次に仮想環境をアクティブにします：
+
+```bash
+# Windows
+subenv/Scripts/activate
+# Linux または macOS
+source subenv/bin/activate
+```
+
+その後、依存関係をインストールします（Linux または macOS 環境の場合、`requirements.txt` 内の `PyAudioWPatch` をコメントアウトする必要があります。このモジュールは Windows 環境専用です）。
+
+> このステップでエラーが発生する場合があります。一般的にはビルド失敗が原因で、エラーメッセージに基づいて対応するビルドツールパッケージをインストールする必要があります。
+
+```bash
+pip install -r requirements.txt
+```
+
+その後、`pyinstaller` を使用してプロジェクトをビルドします：
+
+```bash
+pyinstaller --onefile main-gummy.py
+```
+
+これでプロジェクトのビルドが完了し、`caption-engine/dist` フォルダ内に対応する実行可能ファイルが確認できます。その後、次の操作に進むことができます。
+
+### プロジェクト実行
+
+```bash
+npm run dev
+```
+
+### プロジェクト構築
+
+現在、ソフトウェアは Windows と macOS プラットフォームでのみ構築とテストが行われており、Linux プラットフォームでの正しい動作は保証できません。
+
+```bash
+# Windows 用
+npm run build:win
+# macOS 用
+npm run build:mac
+# Linux 用
+npm run build:linux
+```
--- a/assets/img/02.png
+++ b/assets/img/02.png
--- a/assets/media/api_en.png
+++ b/assets/media/api_en.png
--- a/assets/media/api_ja.png
+++ b/assets/media/api_ja.png
--- a/assets/media/api_zh.png
+++ b/assets/media/api_zh.png
--- a/assets/media/main.png
+++ b/assets/media/main.png
--- a/assets/media/main_en.png
+++ b/assets/media/main_en.png
--- a/assets/media/main_ja.png
+++ b/assets/media/main_ja.png
--- a/assets/media/main_zh.png
+++ b/assets/media/main_zh.png
--- a/assets/media/structure.png
+++ b/assets/media/structure.png
--- a/assets/media/structure_en.png
+++ b/assets/media/structure_en.png
--- a/assets/media/structure_ja.png
+++ b/assets/media/structure_ja.png
--- a/assets/media/structure_zh.png
+++ b/assets/media/structure_zh.png
--- a/assets/structure.pptx
+++ b/assets/structure.pptx
--- a/assets/user-manual_zh.md
+++ b/assets/user-manual_zh.md
@@ -1,59 +0,0 @@
-# Auto Caption 用户手册
-
-对应版本：v0.1.0
-
-## 软件简介
-
-Auto Caption 是一个跨平台的字幕显示软件，能够实时获取系统音频输入（录音）或输出（播放声音）的流式数据，并调用音频转文字的模型生成对应音频的字幕。软件提供的默认字幕引擎（使用阿里云 Gummy 模型）支持九种语言（中英日韩德法俄西意）的识别与翻译。
-
-目前软件默认字幕引擎只有在 Windows 平台下才拥有完整功能。在 Linux 平台下只能生成音频输入（麦克风）的字幕，暂不支持音频输出（播放声音）的字幕生成。
-
-![](./media/main.png)
-
-### 软件缺点
-
-要使用默认字幕服务需要获取阿里云的 API KEY。
-
-软件使用 Electron 构建，因此软件体积不可避免的较大。
-
-## 软件使用
-
-### 准备阿里云百炼平台 API KEY
-
-要使用软件提供的默认字幕引擎（阿里云 Gummy），需要从阿里云百炼平台获取 API KEY 并在本机环境变量中配置。
-
-这部分阿里云提供了详细的教程，可参考：
-
- [获取 API KEY](https://help.aliyun.com/zh/model-studio/get-api-key)
-
- [将 API Key 配置到环境变量](https://help.aliyun.com/zh/model-studio/configure-api-key-through-environment-variables)。
-
-### 修改字幕设置
-
-字幕设置可以分为两类：修改字幕引擎配置、修改字幕样式设置。需要注意的是，在调整的设置的参数后，需要点击每个设置模块右上角的“更改设置”（字幕引擎设置）或“应用样式”（字幕样式设置），更改才会真正生效。如果点击“取消更改”那么当前设置将不会被保存，而是回到上次修改的状态。
-
-### 启动和关闭字幕
-
-在修改完全部配置后，点击界面的“启动字幕引擎”按钮，即可启动字幕。如果需要独立的字幕展示窗口，单击界面的“打开字幕窗口”按钮即可激活独立的字幕展示窗口。如果需要暂停字幕识别，单击界面的“关闭字幕引擎”按钮即可。
-
-### 调整字幕展示窗口
-
-如下图为字幕展示窗口，该窗口实时展示当前最新字幕。窗口右上角三个按钮的功能分别是：将窗口固定在最前面、打开字幕控制窗口、关闭字幕展示窗口。该窗口宽度可以调整，将鼠标移动至窗口的左右边缘，拖动鼠标即可调整宽度。
-
-![](./img/01.png)
-
-### 字幕记录的导出
-
-在字幕控制窗口中可以看到当前收集的所有字幕的记录，点击“导出字幕记录”按钮，即可将字幕记录导出为 JSON 文件。
-
-## 字幕引擎
-
-所谓的字幕引擎实际上是一个子程序，它会实时获取系统音频输入（录音）或输出（播放声音）的流式数据，并调用音频转文字的模型生成对应音频的字幕。生成的字幕通过 IPC 输出为转换为字符串的 JSON 数据，并返回给主程序。主程序读取字幕数据，处理后显示在窗口上。
-
-软件提供了一个默认的字幕引擎，如果你需要其他的字幕引擎，可以通过打开自定义引擎选项来调用其他字幕引擎（其他引擎需要针对进行开发）。其中引擎路径是自定义字幕引擎在你的电脑上的路径，引擎指令是自定义字幕引擎的运行参数，这部分需要按该字幕引擎的规则进行填写。
-
-![](./img/02.png)
-
-注意使用自定义字幕引擎时，前面的字幕引擎的设置将全部不起作用，自定义字幕引擎的配置完全通过引擎指令进行配置。
-
-如果你是开发者，想开发自定义字幕引擎，请查看[字幕引擎说明文档](./engine-manual_zh.md)。
--- a/resources/credits.md
+++ b/resources/credits.md
@@ -5,7 +5,9 @@
 The following icons are used under CC BY 4.0 license:

 - icon.png
+- icon.svg
+- icon.icns

 Source:
 
- https://icon-icons.com/en/pack/Duetone/2064
+- https://icon-icons.com/en/pack/Duetone/2064
--- a/build/entitlements.mac.plist
+++ b/build/entitlements.mac.plist
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+  <dict>
+    <key>com.apple.security.cs.allow-jit</key>
+    <true/>
+    <key>com.apple.security.cs.allow-unsigned-executable-memory</key>
+    <true/>
+    <key>com.apple.security.cs.allow-dyld-environment-variables</key>
+    <true/>
+  </dict>
+</plist>
--- a/build/icon.icns
+++ b/build/icon.icns
--- a/build/icon.png
+++ b/build/icon.png
--- a/build/icon.svg
+++ b/build/icon.svg
@@ -0,0 +1 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="6 6 52 52"><defs><style>.cls-1{fill:#a8d2f0;}.cls-2{fill:#389ad6;}.cls-3,.cls-4{fill:none;}.cls-4{stroke:#295183;stroke-linecap:round;stroke-linejoin:round;stroke-width:2px;}.cls-5{fill:#295183;}</style></defs><title>weather, forecast, direction, compass</title><path class="cls-1" d="M25.56,17.37c-.87,6.45-1.73,22.73,10.26,29.37A1.77,1.77,0,0,1,35.15,50C27.56,51,15,50,13.05,33.13a1.9,1.9,0,0,1,0-.21c0-1.24.11-13.46,10.07-17.41A1.77,1.77,0,0,1,25.56,17.37Z"/><path class="cls-2" d="M30.32,35l1,4.45a3.2,3.2,0,0,0-.22.72c-.1.46-.19.92-.29,1.38-.13.68-.39,1.49-1.06,1.67s-1.32-.44-1.55-1.11S28,40.72,27.84,40s-.76-1.33-1.45-1.26c-.34,0-.62.27-1,.32-.78.16-.31-1.79-.46-2.13a1.67,1.67,0,0,0-1.08-.82c-.91-.27-3.85-.37-3.06-2.07a1.68,1.68,0,0,1,1.07-.76,9.87,9.87,0,0,1,1.4-.32,3.94,3.94,0,0,0,1.26-.32l4.44,1,1.07.23Z"/><path class="cls-2" d="M30.32,28.31l-.24,1.07L29,29.62,27.26,30a1.83,1.83,0,0,0,.52-.8A6,6,0,0,0,28,28c0-.26.07-.5.12-.74a1.26,1.26,0,0,1,.1-.29Z"/><path class="cls-2" d="M34.62,29.37l0-.2.69-.43a2.66,2.66,0,0,1-.38.7Z"/><line class="cls-3" x1="33.74" y1="37.87" x2="33.45" y2="39.16"/><path class="cls-2" d="M37,35.79A4.71,4.71,0,0,1,36,36a7.51,7.51,0,0,0-1,.17,2.43,2.43,0,0,0-.37.13,2,2,0,0,0-.62.47l.4-1.78.23-1.07,1.07-.23Z"/><polyline class="cls-4" points="32 20.86 30.47 27.68 30.17 28.99 29.95 29.95 28.99 30.17 27.42 30.52 26.41 30.75 25.24 31.01 20.86 32 25 32.93 28.99 33.83 29.95 34.04 30.17 35.01 31.07 39.01 32 43.14 32.99 38.75 33.25 37.59 33.47 36.6 33.83 35 34.04 34.04 35 33.83 36.27 33.54 43.14 32 35.01 30.17 34.28 30.01 34.04 29.95 34 29.77 33.83 28.99 33.38 26.98"/><polygon class="cls-4" points="30.17 28.99 29.95 29.95 28.99 30.17 28.09 28.74 26.98 26.98 28.29 27.81 30.17 28.99"/><polygon class="cls-4" points="30.17 35.01 26.98 37.02 28.99 33.83 29.95 34.04 30.17 35.01"/><polygon class="cls-4" points="37.02 37.02 35.26 35.91 33.83 35 34.04 34.04 35 33.83 36.2 35.72 37.02 37.02"/><polygon class="cls-4" points="37.02 26.98 35.01 30.17 34.28 30.01 34.04 29.95 34 29.77 33.83 28.99 37.02 26.98"/><path class="cls-4" d="M38.42,14.13A19.08,19.08,0,1,1,32,13a19.19,19.19,0,0,1,2,.11"/><circle class="cls-5" cx="32.03" cy="16.99" r="1"/><circle class="cls-5" cx="47.01" cy="32.03" r="1"/><circle class="cls-5" cx="31.97" cy="47.01" r="1"/><circle class="cls-5" cx="16.99" cy="31.97" r="1"/></svg>
--- a/caption-engine/audio2text/init.py
+++ b/caption-engine/audio2text/init.py
@@ -0,0 +1,2 @@
+from dashscope.common.error import InvalidParameter
+from .gummy import GummyTranslator
--- a/python-subprocess/audio2text/gummy.py
+++ b/python-subprocess/audio2text/gummy.py
@@ -2,8 +2,9 @@ from dashscope.audio.asr import (
    TranslationRecognizerCallback,
    TranscriptionResult,
    TranslationResult,
-    TranslationRecognizerRealtime    
+    TranslationRecognizerRealtime
 )
+import dashscope
 from datetime import datetime
 import json
 import sys
@@ -17,11 +18,13 @@ class Callback(TranslationRecognizerCallback):
        self.usage = 0
        self.cur_id = -1
        self.time_str = ''
-    
+
    def on_open(self) -> None:
+        # print("on_open")
        pass

    def on_close(self) -> None:
+        # print("on_close")
        pass

    def on_event(
@@ -37,18 +40,18 @@ class Callback(TranslationRecognizerCallback):
            caption['text'] = transcription_result.text
            if caption['index'] != self.cur_id:
                self.cur_id = caption['index']
-                cur_time = datetime.now().strftime('%H:%M:%S')
+                cur_time = datetime.now().strftime('%H:%M:%S.%f')[:-3]
                caption['time_s'] = cur_time
                self.time_str = cur_time
            else:
                caption['time_s'] = self.time_str
-            caption['time_t'] = datetime.now().strftime('%H:%M:%S')
+            caption['time_t'] = datetime.now().strftime('%H:%M:%S.%f')[:-3]
            caption['translation'] = ""
-        
+
        if translation_result is not None:
            lang = translation_result.get_language_list()[0]
            caption['translation'] = translation_result.get_translation(lang).text
-        
+
        if usage:
            self.usage += usage['duration']

@@ -67,7 +70,17 @@ class Callback(TranslationRecognizerCallback):
            print(f"Error sending data to Node.js: {e}", file=sys.stderr)

 class GummyTranslator:
-    def __init__(self, rate, source, target):
+    """
+    使用 Gummy 引擎流式处理的音频数据，并在标准输出中输出与 Auto Caption 软件可读取的 JSON 字符串数据
+
+    初始化参数：
+        rate: 音频采样率
+        source: 源语言代码字符串（zh, en, ja 等）
+        target: 目标语言代码字符串（zh, en, ja 等）
+    """
+    def __init__(self, rate, source, target, api_key):
+        if api_key:
+            dashscope.api_key = api_key
        self.translator = TranslationRecognizerRealtime(
            model = "gummy-realtime-v1",
            format = "pcm",
@@ -78,3 +91,15 @@ class GummyTranslator:
            translation_target_languages = [target],
            callback = Callback()
        )
+
+    def start(self):
+        """启动 Gummy 引擎"""
+        self.translator.start()
+
+    def send_audio_frame(self, data):
+        """发送音频帧"""
+        self.translator.send_audio_frame(data)
+
+    def stop(self):
+        """停止 Gummy 引擎"""
+        self.translator.stop()
--- a/caption-engine/audioprcs/init.py
+++ b/caption-engine/audioprcs/init.py
@@ -0,0 +1 @@
+from .process import mergeChunkChannels, resampleRawChunk
--- a/caption-engine/audioprcs/process.py
+++ b/caption-engine/audioprcs/process.py
@@ -0,0 +1,49 @@
+import samplerate
+import numpy as np
+
+def mergeChunkChannels(chunk, channels):
+    """
+    将当前多通道音频数据块转换为单通道音频数据块
+
+    Args:
+        chunk: (bytes)多通道音频数据块
+        channels: 通道数
+
+    Returns:
+        (bytes)单通道音频数据块
+    """
+    # (length * channels,)
+    chunk_np = np.frombuffer(chunk, dtype=np.int16)
+    # (length, channels)
+    chunk_np = chunk_np.reshape(-1, channels)
+    # (length,)
+    chunk_mono_f = np.mean(chunk_np.astype(np.float32), axis=1)
+    chunk_mono = np.round(chunk_mono_f).astype(np.int16)
+    return chunk_mono.tobytes()
+
+
+def resampleRawChunk(chunk, channels, orig_sr, target_sr, mode="sinc_best"):
+    """
+    将当前多通道音频数据块转换成单通道音频数据块，然后进行重采样
+
+    Args:
+        chunk: (bytes)多通道音频数据块
+        channels: 通道数
+        orig_sr: 原始采样率
+        target_sr: 目标采样率
+        mode: 重采样模式，可选：'sinc_best' | 'sinc_medium' | 'sinc_fastest' | 'zero_order_hold' | 'linear'
+
+    Return:
+        (bytes)单通道音频数据块
+    """
+    # (length * channels,)
+    chunk_np = np.frombuffer(chunk, dtype=np.int16)
+    # (length, channels)
+    chunk_np = chunk_np.reshape(-1, channels)
+    # (length,)
+    chunk_mono_f = np.mean(chunk_np.astype(np.float32), axis=1)
+    chunk_mono = chunk_mono_f.astype(np.int16)
+    ratio = target_sr / orig_sr
+    chunk_mono_r =  samplerate.resample(chunk_mono, ratio, converter_type=mode)
+    chunk_mono_r = np.round(chunk_mono_r).astype(np.int16)
+    return chunk_mono_r.tobytes()
--- a/caption-engine/main-gummy.py
+++ b/caption-engine/main-gummy.py
@@ -0,0 +1,58 @@
+import sys
+import argparse
+
+if sys.platform == 'win32':
+    from sysaudio.win import AudioStream
+elif sys.platform == 'darwin':
+    from sysaudio.darwin import AudioStream
+elif sys.platform == 'linux':
+    from sysaudio.linux import AudioStream
+else:
+    raise NotImplementedError(f"Unsupported platform: {sys.platform}")
+
+from audioprcs import mergeChunkChannels
+from audio2text import InvalidParameter, GummyTranslator
+
+
+def convert_audio_to_text(s_lang, t_lang, audio_type, chunk_rate, api_key):
+    sys.stdout.reconfigure(line_buffering=True) # type: ignore
+    stream = AudioStream(audio_type, chunk_rate)
+
+    if t_lang == 'none':
+        gummy = GummyTranslator(stream.RATE, s_lang, None, api_key)
+    else:
+        gummy = GummyTranslator(stream.RATE, s_lang, t_lang, api_key)
+
+    stream.openStream()
+    gummy.start()
+
+    while True:
+        try:
+            chunk = stream.read_chunk()
+            chunk_mono = mergeChunkChannels(chunk, stream.CHANNELS)
+            try:
+                gummy.send_audio_frame(chunk_mono)
+            except InvalidParameter:
+                gummy.start()
+                gummy.send_audio_frame(chunk_mono)
+        except KeyboardInterrupt:
+            stream.closeStream()
+            gummy.stop()
+            break
+
+
+if __name__ == "__main__":
+    parser = argparse.ArgumentParser(description='Convert system audio stream to text')
+    parser.add_argument('-s', '--source_language', default='en', help='Source language code')
+    parser.add_argument('-t', '--target_language', default='zh', help='Target language code')
+    parser.add_argument('-a', '--audio_type', default=0, help='Audio stream source: 0 for output audio stream, 1 for input audio stream')
+    parser.add_argument('-c', '--chunk_rate', default=20, help='The number of audio stream chunks collected per second.')
+    parser.add_argument('-k', '--api_key', default='', help='API KEY for Gummy model')
+    args = parser.parse_args()
+    convert_audio_to_text(
+        args.source_language,
+        args.target_language,
+        int(args.audio_type),
+        int(args.chunk_rate),
+        args.api_key
+    )
--- a/python-subprocess/main-gummy.spec
+++ b/python-subprocess/main-gummy.spec
--- a/caption-engine/requirements.txt
+++ b/caption-engine/requirements.txt
@@ -0,0 +1,6 @@
+dashscope
+numpy
+samplerate
+PyAudio
+PyAudioWPatch # Windows only
+pyinstaller
--- a/caption-engine/sysaudio/init.py
+++ b/caption-engine/sysaudio/init.py
--- a/caption-engine/sysaudio/darwin.py
+++ b/caption-engine/sysaudio/darwin.py
@@ -0,0 +1,85 @@
+"""获取 MacOS 系统音频输入/输出流"""
+
+import pyaudio
+
+
+class AudioStream:
+    """
+    获取系统音频流（支持 BlackHole 作为系统音频输出捕获）
+
+    初始化参数：
+        audio_type: 0-系统音频输出流（需配合 BlackHole），1-系统音频输入流
+        chunk_rate: 每秒采集音频块的数量，默认为20
+    """
+    def __init__(self, audio_type=0, chunk_rate=20):
+        self.audio_type = audio_type
+        self.mic = pyaudio.PyAudio()
+        if self.audio_type == 0:
+            self.device = self.getOutputDeviceInfo()
+        else:
+            self.device = self.mic.get_default_input_device_info()
+        self.stream = None
+        self.SAMP_WIDTH = pyaudio.get_sample_size(pyaudio.paInt16)
+        self.FORMAT = pyaudio.paInt16
+        self.CHANNELS = self.device["maxInputChannels"]
+        self.RATE = int(self.device["defaultSampleRate"])
+        self.CHUNK = self.RATE // chunk_rate
+        self.INDEX = self.device["index"]
+
+    def getOutputDeviceInfo(self):
+        """查找指定关键词的输入设备"""
+        device_count = self.mic.get_device_count()
+        for i in range(device_count):
+            dev_info = self.mic.get_device_info_by_index(i)
+            if 'blackhole' in dev_info["name"].lower():    
+                return dev_info
+        raise Exception("The device containing BlackHole was not found.")
+
+    def printInfo(self):
+        dev_info = f"""
+        采样输入设备：
+            - 设备类型：{ "音频输出" if self.audio_type == 0 else "音频输入" }
+            - 序号：{self.device['index']}
+            - 名称：{self.device['name']}
+            - 最大输入通道数：{self.device['maxInputChannels']}
+            - 默认低输入延迟：{self.device['defaultLowInputLatency']}s
+            - 默认高输入延迟：{self.device['defaultHighInputLatency']}s
+            - 默认采样率：{self.device['defaultSampleRate']}Hz
+
+        音频样本块大小：{self.CHUNK}
+        样本位宽：{self.SAMP_WIDTH}
+        采样格式：{self.FORMAT}
+        音频通道数：{self.CHANNELS}
+        音频采样率：{self.RATE}
+        """
+        print(dev_info)
+
+    def openStream(self):
+        """
+        打开并返回系统音频输出流
+        """
+        if self.stream: return self.stream
+        self.stream = self.mic.open(
+            format = self.FORMAT,
+            channels = int(self.CHANNELS),
+            rate = self.RATE,
+            input = True,
+            input_device_index = int(self.INDEX)
+        )
+        return self.stream
+
+    def read_chunk(self):
+        """
+        读取音频数据
+        """
+        if not self.stream: return None
+        return self.stream.read(self.CHUNK, exception_on_overflow=False)
+
+    def closeStream(self):
+        """
+        关闭系统音频输出流
+        """
+        if self.stream is None: return
+        self.stream.stop_stream()
+        self.stream.close()
+        self.stream = None
--- a/python-subprocess/sysaudio/linux.py
+++ b/python-subprocess/sysaudio/linux.py
@@ -1,30 +1,17 @@
+"""获取 Linux 系统音频输入流"""
+
 import pyaudio
-import numpy as np
-
-def mergeStreamChannels(data, channels):
-    """
-    将当前多通道流数据合并为单通道流数据
-
-    Args:
-        data: 多通道数据
-        channels: 通道数
-
-    Returns:
-        mono_data_bytes: 单通道数据
-    """
-    # (length * channels,)
-    data_np = np.frombuffer(data, dtype=np.int16)
-    # (length, channels)
-    data_np_r = data_np.reshape(-1, channels)
-    # (length,)
-    mono_data = np.mean(data_np_r.astype(np.float32), axis=1)
-    mono_data = mono_data.astype(np.int16)
-    mono_data_bytes = mono_data.tobytes()
-    return mono_data_bytes


 class AudioStream:
-    def __init__(self, audio_type=1):
+    """
+    获取系统音频流
+
+    初始化参数：
+        audio_type: 0-系统音频输出流（不支持，不会生效），1-系统音频输入流（默认）
+        chunk_rate: 每秒采集音频块的数量，默认为20
+    """
+    def __init__(self, audio_type=1,  chunk_rate=20):
        self.audio_type = audio_type
        self.mic = pyaudio.PyAudio()
        self.device = self.mic.get_default_input_device_info()
@@ -33,7 +20,7 @@ class AudioStream:
        self.FORMAT = pyaudio.paInt16
        self.CHANNELS = self.device["maxInputChannels"]
        self.RATE = int(self.device["defaultSampleRate"])
-        self.CHUNK = self.RATE // 20
+        self.CHUNK = self.RATE // chunk_rate
        self.INDEX = self.device["index"]

    def printInfo(self):
@@ -49,7 +36,7 @@ class AudioStream:

        音频样本块大小：{self.CHUNK}
        样本位宽：{self.SAMP_WIDTH}
-        音频数据格式：{self.FORMAT}
+        采样格式：{self.FORMAT}
        音频通道数：{self.CHANNELS}
        音频采样率：{self.RATE}
        """
@@ -62,13 +49,20 @@ class AudioStream:
        if self.stream: return self.stream
        self.stream = self.mic.open(
            format = self.FORMAT,
-            channels = self.CHANNELS,
+            channels = int(self.CHANNELS),
            rate = self.RATE,
            input = True,
-            input_device_index = self.INDEX
+            input_device_index = int(self.INDEX)
        )
        return self.stream
-    
+
+    def read_chunk(self):
+        """
+        读取音频数据
+        """
+        if not self.stream: return None
+        return self.stream.read(self.CHUNK)
+
    def closeStream(self):
        """
        关闭系统音频输出流
@@ -76,4 +70,4 @@ class AudioStream:
        if self.stream is None: return
        self.stream.stop_stream()
        self.stream.close()
-        self.stream = None
+        self.stream = None
--- a/python-subprocess/sysaudio/win.py
+++ b/python-subprocess/sysaudio/win.py
@@ -1,7 +1,6 @@
-"""获取 Windows 系统音频输出流"""
+"""获取 Windows 系统音频输入/输出流"""

 import pyaudiowpatch as pyaudio
-import numpy as np


 def getDefaultLoopbackDevice(mic: pyaudio.PyAudio, info = True)->dict:
@@ -35,40 +34,20 @@ def getDefaultLoopbackDevice(mic: pyaudio.PyAudio, info = True)->dict:
            print("Run `python -m pyaudiowpatch` to check available devices.")
            print("Exiting...")
            exit()
-            
+
    if(info): print(f"Output Stream Device: #{default_speaker['index']} {default_speaker['name']}")
    return default_speaker


-def mergeStreamChannels(data, channels):
-    """
-    将当前多通道流数据合并为单通道流数据
-
-    Args:
-        data: 多通道数据
-        channels: 通道数
-
-    Returns:
-        mono_data_bytes: 单通道数据
-    """
-    # (length * channels,)
-    data_np = np.frombuffer(data, dtype=np.int16)
-    # (length, channels)
-    data_np_r = data_np.reshape(-1, channels)
-    # (length,)
-    mono_data = np.mean(data_np_r.astype(np.float32), axis=1)
-    mono_data = mono_data.astype(np.int16)
-    mono_data_bytes = mono_data.tobytes()
-    return mono_data_bytes
-
 class AudioStream:
    """
    获取系统音频流
-    
-    参数：
-        audio_type: （默认）0-系统音频输出流，1-系统音频输入流
+
+    初始化参数：
+        audio_type: 0-系统音频输出流（默认），1-系统音频输入流
+        chunk_rate: 每秒采集音频块的数量，默认为20
    """
-    def __init__(self, audio_type=0):
+    def __init__(self, audio_type=0, chunk_rate=20):
        self.audio_type = audio_type
        self.mic = pyaudio.PyAudio()
        if self.audio_type == 0:
@@ -80,13 +59,13 @@ class AudioStream:
        self.FORMAT = pyaudio.paInt16
        self.CHANNELS = self.device["maxInputChannels"]
        self.RATE = int(self.device["defaultSampleRate"])
-        self.CHUNK = self.RATE // 20
+        self.CHUNK = self.RATE // chunk_rate
        self.INDEX = self.device["index"]

    def printInfo(self):
        dev_info = f"""
        采样设备：
-            - 设备类型：{ "音频输入" if self.audio_type == 0 else "音频输出" }
+            - 设备类型：{ "音频输出" if self.audio_type == 0 else "音频输入" }
            - 序号：{self.device['index']}
            - 名称：{self.device['name']}
            - 最大输入通道数：{self.device['maxInputChannels']}
@@ -97,7 +76,7 @@ class AudioStream:

        音频样本块大小：{self.CHUNK}
        样本位宽：{self.SAMP_WIDTH}
-        音频数据格式：{self.FORMAT}
+        采样格式：{self.FORMAT}
        音频通道数：{self.CHANNELS}
        音频采样率：{self.RATE}
        """
@@ -116,7 +95,14 @@ class AudioStream:
            input_device_index = self.INDEX
        )
        return self.stream
-    
+
+    def read_chunk(self):
+        """
+        读取音频数据
+        """
+        if not self.stream: return None
+        return self.stream.read(self.CHUNK, exception_on_overflow=False)
+
    def closeStream(self):
        """
        关闭系统音频输出流
@@ -124,4 +110,4 @@ class AudioStream:
        if self.stream is None: return
        self.stream.stop_stream()
        self.stream.close()
-        self.stream = None
+        self.stream = None
--- a/docs/CHANGELOG.md
+++ b/docs/CHANGELOG.md
@@ -0,0 +1,74 @@
+## v0.0.1
+
+2025-06-22
+
+发布第一版软件。
+
+## v0.1.0
+
+2025-06-26
+
+### 新增功能
+
+- 添加错误通知
+- 添加默认引擎的环境变量检查
+- 添加配置数据文件保存和载入
+- 添加字幕样式恢复默认的选项
+- 添加项目关于信息
+
+### 新增文档
+
+- 添加用户说明文档
+- 添加字幕引擎说明文档
+
+## v0.2.0
+
+2025-07-05
+
+对项目进行了重构，修复了 bug，添加了新功能。本版本为正式版。
+
+### 新增功能
+
+- 添加长字幕内容隐藏功能 (#1)
+- 添加多界面语言支持（中文、英语、日语）
+- 添加暗色主题
+
+### 提升体验
+
+- 优化界面布局
+- 添加更多可保存和载入的配置项
+- 为字幕引擎添加更严格的状态限制，防止出现僵尸进程
+
+### 修复bug
+
+- 添加字幕引擎长时间空置后报错的问题 (#2)
+
+### 新增文档
+
+- 新增日语说明文档
+- 新增英语、日语字幕引擎说明文档和用户手册
+- 新增 electron ipc api 文档
+
+## v0.3.0
+
+2025-07-09
+
+对字幕引擎代码进行了重构，软件适配了 macOS 平台，添加了新功能。
+
+### 新增功能
+
+- 添加软件内设置 API KEY 的功能
+- 添加字幕字体粗细和文本阴影的设置
+- 添加复制字幕记录到剪贴板的功能 (#3)
+
+### 优化体验
+
+- 字幕时间记录精确到毫秒
+- 更详细的说明文档（添加字幕引擎规格说明、用户文档和字幕引擎文档更新） (#4)
+- 适配 macOS 平台
+- 字幕窗口有了更大的顶置优先级
+- 预览窗口可以实时显示最新的字幕内容
+
+### 修复bug
+
+- 修复使用系统主题时暗色系统载入为亮色的问题
--- a/docs/TODO.md
+++ b/docs/TODO.md
@@ -0,0 +1,22 @@
+## 已完成
+
+- [x] 添加英语和日语语言支持 *2025/07/04*
+- [x] 添加暗色主题 *2025/07/04*
+- [x] 优化长字幕显示效果 *2025/07/05*
+- [x] 修复字幕引擎空置报错的问题 *2025/07/05*
+- [x] 增强字幕窗口顶置优先级 *2025/07/07*
+- [x] 添加对自带字幕引擎的详细规格说明 *2025/07/07*
+- [x] 添加复制字幕到剪贴板功能 *2025/07/08*
+- [x] 适配 macOS 平台 *2025/07/08*
+- [x] 添加字幕文字描边 *2025/07/09*
+
+## 待完成
+
+- [ ] 添加本地字幕引擎
+  - [ ] 添加基于 Vosk 的字幕引擎
+  - [ ] 验证 / 添加基于 FunASR 的字幕引擎
+- [ ] 减小软件不必要的体积
+
+## 遥远的未来
+
+- [ ] 使用 Tauri 框架重新开发
--- a/docs/api-docs/electron-ipc.md
+++ b/docs/api-docs/electron-ipc.md
@@ -0,0 +1,289 @@
+# electron ipc api-doc
+
+本文档主要记录主进程和渲染进程的通信约定。
+
+## 命名方式
+
+本项目渲染进程包含两个：字幕窗口和控制窗口，主进程需要分别和两者进行通信。通信命令的命名规则如下：
+
+1. 命令一般由三个关键字组成，由点号隔开。
+2. 第一个关键字表示通信发送目标：
+   - `config` 表示控制窗口类实例（后端）或控制窗口（前端）
+   - `engine` 表示字幕窗口类实例（后端）或字幕窗口（前端）
+   - `both` 表示上述对象都有可能成为目标
+3. 第二个关键字表示需要修改的对象 / 发生改变的对象，采用小驼峰命名
+4. 第三个关键字一般是动词，表示通信发生时对应动作 / 需要进行的操作
+
+根据上面的描述可以看出通信命令一般有两种语义，一种表示要求执行的操作，另一种表示当前发生的事件。
+
+## 前端 <=> 后端
+
+### `both.window.mounted`
+
+**介绍：** 前端窗口挂载完毕，请求最新的配置数据
+
+**发起方：** 前端
+
+**接收方：** 后端
+
+**数据类型：**
+
+- 发送：无数据
+- 接收：`FullConfig`
+
+### `control.nativeTheme.get`
+
+**介绍：** 前端获取系统当前的主题
+
+**发起方：** 前端控制窗口
+
+**接收方：** 后端控制窗口实例
+
+**数据类型：**
+
+- 发送：无数据
+- 接收：`string`
+
+## 前端 ==> 后端
+
+### `control.uiLanguage.change`
+
+**介绍：** 前端修改字界面语言，将修改同步给后端
+
+**发起方：** 前端控制窗口
+
+**接收方：** 后端控制窗口实例
+
+**数据类型：** `UILanguage`
+
+### `control.uiTheme.change`
+
+**介绍：** 前端修改字界面主题，将修改同步给后端
+
+**发起方：** 前端控制窗口
+
+**接收方：** 后端控制窗口实例
+
+**数据类型：** `UITheme`
+
+### `control.leftBarWidth.change`
+
+**介绍：** 前端修改边栏宽度，将修改同步给后端
+
+**发起方：** 前端控制窗口
+
+**接收方：** 后端控制窗口实例
+
+**数据类型：** `number`
+
+### `control.captionLog.clear`
+
+**介绍：** 清空字幕记录
+
+**发起方：** 前端控制窗口
+
+**接收方：** 后端控制窗口实例
+
+**数据类型：** 无数据
+
+### `control.styles.change`
+
+**介绍：** 前端修改字幕样式，将修改同步给后端
+
+**发起方：** 前端控制窗口
+
+**接收方：** 后端控制窗口实例
+
+**数据类型：** `Styles`
+
+### `control.styles.reset`
+
+**介绍：** 将字幕样式恢复为默认
+
+**发起方：** 前端控制窗口
+
+**接收方：** 后端控制窗口实例
+
+**数据类型：** 无数据
+
+### `control.controls.change`
+
+**介绍：** 前端修改了字幕引擎配置，将最新配置发送给后端
+
+**发起方：** 前端控制窗口
+
+**接收方：** 后端控制窗口实例
+
+**数据类型：** `Controls`
+
+### `control.captionWindow.activate`
+
+**介绍：** 激活字幕窗口
+
+**发起方：** 前端控制窗口
+
+**接收方：** 后端控制窗口实例
+
+**数据类型：** 无数据
+
+### `control.engine.start`
+
+**介绍：** 启动字幕引擎
+
+**发起方：** 前端控制窗口
+
+**接收方：** 后端控制窗口实例
+
+**数据类型：** 无数据
+
+### `control.engine.stop`
+
+**介绍：** 关闭字幕引擎
+
+**发起方：** 前端控制窗口
+
+**接收方：** 后端控制窗口实例
+
+**数据类型：** 无数据
+
+### `caption.windowHeight.change`
+
+**介绍：** 字幕窗口宽度发生改变
+
+**发起方：** 前端字幕窗口
+
+**接收方：** 后端字幕窗口实例
+
+**数据类型：** `number`
+
+### `caption.pin.set`
+
+**介绍：** 是否将窗口置顶
+
+**发起方：** 前端字幕窗口
+
+**接收方：** 后端字幕窗口实例
+
+**数据类型：** `boolean`
+
+### `caption.controlWindow.activate`
+
+**介绍：** 激活控制窗口
+
+**发起方：** 前端字幕窗口
+
+**接收方：** 后端字幕窗口实例
+
+**数据类型：** 无数据
+
+### `caption.window.close`
+
+**介绍：** 关闭字幕窗口
+
+**发起方：** 前端字幕窗口
+
+**接收方：** 后端字幕窗口实例
+
+**数据类型：** 无数据
+
+## 后端 ==> 前端
+
+### `control.uiLanguage.set`
+
+**介绍：** 后端将最新界面语言发送给前端，前端进行设置
+
+**发起方：** 后端
+
+**接收方：** 字幕窗口
+
+**数据类型：** `UILanguage`
+
+### `control.nativeTheme.change`
+
+**介绍：** 系统主题发生改变
+
+**发起方：** 后端
+
+**接收方：** 前端控制窗口
+
+**数据类型：** `string`
+
+### `control.engine.started`
+
+**介绍：** 引擎启动成功
+
+**发起方：** 后端
+
+**接收方：** 前端控制窗口
+
+**数据类型：** 无数据
+
+### `control.engine.stopped`
+
+**介绍：** 引擎关闭
+
+**发起方：** 后端
+
+**接收方：** 前端控制窗口
+
+**数据类型：** 无数据
+
+### `control.error.occurred`
+
+**介绍：** 发送错误
+
+**发起方：** 后端
+
+**接收方：** 前端控制窗口
+
+**数据类型：** `string`
+
+### `control.controls.set`
+
+**介绍：** 后端将最新字幕引擎配置发送给前端，前端进行设置
+
+**发起方：** 后端
+
+**接收方：** 前端控制窗口
+
+**数据类型：** `Controls`
+
+### `both.styles.set`
+
+**介绍：** 后端将最新字幕样式发送给前端，前端进行设置
+
+**发起方：** 后端
+
+**接收方：** 前端
+
+**数据类型：** `Styles`
+
+### `both.captionLog.add`
+
+**介绍：** 添加一条新的字幕数据
+
+**发起方：** 后端
+
+**接收方：** 前端
+
+**数据类型：** `CaptionItem`
+
+### `both.captionLog.upd`
+
+**介绍：** 更新最后一条字幕数据
+
+**发起方：** 后端
+
+**接收方：** 前端
+
+**数据类型：** `CaptionItem`
+
+### `both.captionLog.set`
+
+**介绍：** 设置全部的字幕数据
+
+**发起方：** 后端
+
+**接收方：** 前端
+
+**数据类型：** `CaptionItem[]`
--- a/docs/engine-manual/en.md
+++ b/docs/engine-manual/en.md
@@ -0,0 +1,152 @@
+# Caption Engine Documentation
+
+Corresponding Version: v0.3.0
+
+![](../../assets/media/structure_en.png)
+
+## Introduction to the Caption Engine
+
+The so-called caption engine is actually a subprogram that captures real-time streaming data from the system's audio input (recording) or output (playing sound) and calls an audio-to-text model to generate captions for the corresponding audio. The generated captions are converted into a JSON-formatted string and passed to the main program through standard output (it must be ensured that the string read by the main program can be correctly interpreted as a JSON object). The main program reads and interprets the caption data, processes it, and then displays it on the window.
+
+## Functions Required by the Caption Engine
+
+### Audio Acquisition
+
+First, your caption engine needs to capture streaming data from the system's audio input (recording) or output (playing sound). If using Python for development, you can use the PyAudio library to obtain microphone audio input data (cross-platform). Use the PyAudioWPatch library to get system audio output (Windows platform only).
+
+Generally, the captured audio stream data consists of short audio chunks, and the size of these chunks should be adjusted according to the model. For example, Alibaba Cloud's Gummy model performs better with 0.05-second audio chunks compared to 0.2-second ones.
+
+### Audio Processing
+
+The acquired audio stream may need preprocessing before being converted to text. For instance, Alibaba Cloud's Gummy model can only recognize single-channel audio streams, while the collected audio streams are typically dual-channel, thus requiring conversion from dual-channel to single-channel. Channel conversion can be achieved using methods in the NumPy library.
+
+You can directly use the audio acquisition (`caption-engine/sysaudio`) and audio processing (`caption-engine/audioprcs`) modules I have developed.
+
+### Audio to Text Conversion
+
+After obtaining the appropriate audio stream, you can convert it into text. This is generally done using various models based on your requirements.
+
+A nearly complete implementation of a caption engine is as follows:
+
+```python
+import sys
+import argparse
+
+# Import system audio acquisition module
+if sys.platform == 'win32':
+    from sysaudio.win import AudioStream
+elif sys.platform == 'darwin':
+    from sysaudio.darwin import AudioStream
+elif sys.platform == 'linux':
+    from sysaudio.linux import AudioStream
+else:
+    raise NotImplementedError(f"Unsupported platform: {sys.platform}")
+
+# Import audio processing functions
+from audioprcs import mergeChunkChannels
+# Import audio-to-text module
+from audio2text import InvalidParameter, GummyTranslator
+
+
+def convert_audio_to_text(s_lang, t_lang, audio_type, chunk_rate, api_key):
+    # Set standard output to line buffering
+    sys.stdout.reconfigure(line_buffering=True) # type: ignore
+
+    # Create instances for audio acquisition and speech-to-text
+    stream = AudioStream(audio_type, chunk_rate)
+    if t_lang == 'none':
+        gummy = GummyTranslator(stream.RATE, s_lang, None, api_key)
+    else:
+        gummy = GummyTranslator(stream.RATE, s_lang, t_lang, api_key)
+
+    # Start instances
+    stream.openStream()
+    gummy.start()
+
+    while True:
+        try:
+            # Read audio stream data
+            chunk = stream.read_chunk()
+            chunk_mono = mergeChunkChannels(chunk, stream.CHANNELS)
+            try:
+                # Call the model for translation
+                gummy.send_audio_frame(chunk_mono)
+            except InvalidParameter:
+                gummy.start()
+                gummy.send_audio_frame(chunk_mono)
+        except KeyboardInterrupt:
+            stream.closeStream()
+            gummy.stop()
+            break
+```
+
+### Data Transmission
+
+After obtaining the text of the current audio stream, it needs to be transmitted to the main program. The caption engine process passes the caption data to the Electron main process through standard output.
+
+The content transmitted must be a JSON string, where the JSON object must contain the following parameters:
+
+```typescript
+export interface CaptionItem {
+  index: number, // Caption sequence number
+  time_s: string, // Caption start time
+  time_t: string, // Caption end time
+  text: string, // Caption content
+  translation: string // Caption translation
+}
+```
+
+**It is essential to ensure that each time we output caption JSON data, the buffer is flushed, ensuring that the string received by the Electron main process can always be interpreted as a JSON object.**
+
+If using Python, you can refer to the following method to pass data to the main program:
+
+```python
+# caption-engine\main-gummy.py
+sys.stdout.reconfigure(line_buffering=True)
+
+# caption-engine\audio2text\gummy.py
+...
+    def send_to_node(self, data):
+        """
+        Send data to the Node.js process
+        """
+        try:
+            json_data = json.dumps(data) + '\n'
+            sys.stdout.write(json_data)
+            sys.stdout.flush()
+        except Exception as e:
+            print(f"Error sending data to Node.js: {e}", file=sys.stderr)
+...
+```
+
+Data receiver code is as follows:
+
+
+```typescript
+// src\main\utils\engine.ts
+...
+    this.process.stdout.on('data', (data) => {
+      const lines = data.toString().split('\n');
+      lines.forEach((line: string) => {
+        if (line.trim()) {
+          try {
+            const caption = JSON.parse(line);
+            addCaptionLog(caption);
+          } catch (e) {
+            controlWindow.sendErrorMessage('Unable to parse the output from the caption engine as a JSON object: ' + e)
+            console.error('[ERROR] Error parsing JSON:', e);
+          }
+        }
+      });
+    });
+
+    this.process.stderr.on('data', (data) => {
+      controlWindow.sendErrorMessage('Caption engine error: ' + data)
+      console.error(`[ERROR] Subprocess Error: ${data}`);
+    });
+...
+```
+
+## Reference Code
+
+The `main-gummy.py` file under the `caption-engine` folder in this project serves as the entry point for the default caption engine. The `src\main\utils\engine.ts` file contains the server-side code for acquiring and processing data from the caption engine. You can read and understand the implementation details and the complete execution process of the caption engine as needed.
--- a/docs/engine-manual/ja.md
+++ b/docs/engine-manual/ja.md
@@ -0,0 +1,124 @@
+# 字幕エンジンの説明文書
+
+対応バージョン：v0.3.0
+
+この文書は大規模モデルを使用して翻訳されていますので、内容に正確でない部分があるかもしれません。
+
+![](../../assets/media/structure_ja.png)
+
+## 字幕エンジンの紹介
+
+所謂字幕エンジンは実際にはサブプログラムであり、システムの音声入力（録音）または出力（音声再生）のストリーミングデータをリアルタイムで取得し、音声からテキストへの変換モデルを使って対応する音声の字幕を生成します。生成された字幕はJSON形式の文字列データに変換され、標準出力を通じてメインプログラムに渡されます（メインプログラムが読み取った文字列が正しいJSONオブジェクトとして解釈されることが保証される必要があります）。メインプログラムは字幕データを読み取り、解釈して処理し、ウィンドウ上に表示します。
+
+## 字幕エンジンが必要な機能
+
+### 音声の取得
+
+まず、あなたの字幕エンジンはシステムの音声入力（録音）または出力（音声再生）のストリーミングデータを取得する必要があります。Pythonを使用して開発する場合、PyAudioライブラリを使ってマイクからの音声入力データを取得できます（全プラットフォーム共通）。また、WindowsプラットフォームではPyAudioWPatchライブラリを使ってシステムの音声出力を取得することもできます。
+
+一般的に取得される音声ストリームデータは、比較的短い時間間隔の音声ブロックで構成されています。モデルに合わせて音声ブロックのサイズを調整する必要があります。例えば、アリババクラウドのGummyモデルでは、0.05秒の音声ブロックを使用した認識結果の方が0.2秒の音声ブロックよりも優れています。
+
+### 音声の処理
+
+取得した音声ストリームは、テキストに変換する前に前処理が必要な場合があります。例えば、アリババクラウドのGummyモデルは単一チャンネルの音声ストリームしか認識できませんが、収集された音声ストリームは通常二重チャンネルであるため、二重チャンネルの音声ストリームを単一チャンネルに変換する必要があります。チャンネル数の変換はNumPyライブラリのメソッドを使って行うことができます。
+
+あなたは私によって開発された音声の取得（`caption-engine/sysaudio`）と音声の処理（`caption-engine/audioprcs`）モジュールを直接使用することができます。
+
+### 音声からテキストへの変換
+
+適切な音声ストリームを得た後、それをテキストに変換することができます。通常、様々なモデルを使って音声ストリームをテキストに変換します。必要に応じてモデルを選択することができます。
+
+ほぼ完全な字幕エンジンの実装例：
+
+```python
+import sys
+import argparse
+
+# システム音声の取得に関する設定
+if sys.platform == 'win32':
+    from sysaudio.win import AudioStream
+elif sys.platform == 'darwin':
+    from sysaudio.darwin import AudioStream
+elif sys.platform == 'linux':
+    from sysaudio.linux import AudioStream
+else:
+    raise NotImplementedError(f"Unsupported platform: {sys.platform}")
+
+# 音声処理関数のインポート
+from audioprcs import mergeChunkChannels
+# 音声からテキストへの変換モジュールのインポート
+from audio2text import InvalidParameter, GummyTranslator
+
+
+def convert_audio_to_text(s_lang, t_lang, audio_type, chunk_rate, api_key):
+    # 標準出力をラインバッファリングに設定
+    sys.stdout.reconfigure(line_buffering=True) # type: ignore
+
+    # 音声の取得と音声からテキストへの変換のインスタンスを作成
+    stream = AudioStream(audio_type, chunk_rate)
+    if t_lang == 'none':
+        gummy = GummyTranslator(stream.RATE, s_lang, None, api_key)
+    else:
+        gummy = GummyTranslator(stream.RATE, s_lang, t_lang, api_key)
+
+    # インスタンスを開始
+    stream.openStream()
+    gummy.start()
+
+    while True:
+        try:
+            # 音声ストリームデータを読み込む
+            chunk = stream.read_chunk()
+            chunk_mono = mergeChunkChannels(chunk, stream.CHANNELS)
+            try:
+                # モデルを使って翻訳を行う
+                gummy.send_audio_frame(chunk_mono)
+            except InvalidParameter:
+                gummy.start()
+                gummy.send_audio_frame(chunk_mono)
+        except KeyboardInterrupt:
+            stream.closeStream()
+            gummy.stop()
+            break
+```
+
+### データの伝送
+
+現在の音声ストリームのテキストを得たら、それをメインプログラムに渡す必要があります。字幕エンジンプロセスは標準出力を通じて電子メール主プロセスに字幕データを渡します。
+
+渡す内容はJSON文字列でなければなりません。JSONオブジェクトには以下のパラメータを含める必要があります：
+
+```typescript
+export interface CaptionItem {
+  index: number, // 字幕番号
+  time_s: string, // 現在の字幕開始時間
+  time_t: string, // 現在の字幕終了時間
+  text: string, // 字幕内容
+  translation: string // 字幕翻訳
+}
+```
+
+**必ず、字幕JSONデータを出力するたびにバッファをフラッシュし、electron主プロセスが受け取る文字列が常にJSONオブジェクトとして解釈できるようにする必要があります。**
+
+Python言語を使用する場合、以下の方法でデータをメインプログラムに渡すことができます：
+
+```python
+# caption-engine\main-gummy.py
+sys.stdout.reconfigure(line_buffering=True)
+
+# caption-engine\audio2text\gummy.py
+...
+    def send_to_node(self, data):
+        """
+        Node.jsプロセスにデータを送信する
+        """
+        try:
+            json_data = json.dumps(data) + '\n'
+            sys.stdout.write(json_data)
+            sys.stdout.flush()
+        except Exception as e:
+            print(f"Error sending data to Node.js: {e}", file=sys.stderr)
+...
+```
+
+データ受信側のコードは
--- a/assets/engine-manual_zh.md
+++ b/assets/engine-manual_zh.md
@@ -1,10 +1,12 @@
 # 字幕引擎说明文档

-![](./media/structure.png)
+对应版本：v0.3.0
+
+![](../../assets/media/structure_zh.png)

 ## 字幕引擎介绍

-所谓的字幕引擎实际上是一个子程序，它会实时获取系统音频输入（录音）或输出（播放声音）的流式数据，并调用音频转文字的模型生成对应音频的字幕。生成的字幕通过 IPC 输出为转换为 JSON 格式的字符串数据，并返回给主程序。主程序读取字幕数据，处理后显示在窗口上。
+所谓的字幕引擎实际上是一个子程序，它会实时获取系统音频输入（录音）或输出（播放声音）的流式数据，并调用音频转文字的模型生成对应音频的字幕。生成的字幕转换为 JSON 格式的字符串数据，并通过标准输出传递给主程序（需要保证主程序读取到的字符串可以被正确解释为 JSON 对象）。主程序读取并解释字幕数据，处理后显示在窗口上。

 ## 字幕引擎需要实现的功能

@@ -18,13 +20,71 @@

 获取到的音频流在转文字之前可能需要进行预处理。比如阿里云的 Gummy 模型只能识别单通道的音频流，而收集的音频流一般是双通道的，因此要将双通道音频流转换为单通道。通道数的转换可以使用 NumPy 库中的方法实现。

+你可以直接使用我开发好的音频获取（`caption-engine/sysaudio`）和音频处理（`caption-engine/audioprcs`）模块。
+
 ### 音频转文字

 在得到了合适的音频流后，就可以将音频流转换为文字了。一般使用各种模型来实现音频流转文字。可根据需求自行选择模型。

+一个接近完整的字幕引擎实例如下：
+
+```python
+import sys
+import argparse
+
+# 引入系统音频获取勒
+if sys.platform == 'win32':
+    from sysaudio.win import AudioStream
+elif sys.platform == 'darwin':
+    from sysaudio.darwin import AudioStream
+elif sys.platform == 'linux':
+    from sysaudio.linux import AudioStream
+else:
+    raise NotImplementedError(f"Unsupported platform: {sys.platform}")
+
+# 引入音频处理函数
+from audioprcs import mergeChunkChannels
+# 引入音频转文本模块
+from audio2text import InvalidParameter, GummyTranslator
+
+
+def convert_audio_to_text(s_lang, t_lang, audio_type, chunk_rate, api_key):
+    # 设置标准输出为行缓冲
+    sys.stdout.reconfigure(line_buffering=True) # type: ignore
+
+    # 创建音频获取和语音转文字实例
+    stream = AudioStream(audio_type, chunk_rate)
+    if t_lang == 'none':
+        gummy = GummyTranslator(stream.RATE, s_lang, None, api_key)
+    else:
+        gummy = GummyTranslator(stream.RATE, s_lang, t_lang, api_key)
+
+    # 启动实例
+    stream.openStream()
+    gummy.start()
+
+    while True:
+        try:
+            # 读取音频流数据
+            chunk = stream.read_chunk()
+            chunk_mono = mergeChunkChannels(chunk, stream.CHANNELS)
+            try:
+                # 调用模型进行翻译
+                gummy.send_audio_frame(chunk_mono)
+            except InvalidParameter:
+                gummy.start()
+                gummy.send_audio_frame(chunk_mono)
+        except KeyboardInterrupt:
+            stream.closeStream()
+            gummy.stop()
+            break
+```
+
 ### 数据传递

-在获取到当前音频流的文字后，需要将文字传递给主程序。使用进程间通信(IPC)的方式，比如通过标准输入输出流或者命名管道来实现。传递的内容必须是 JSON 字符串，其中 JSON 对象需要包含的参数如下：
+在获取到当前音频流的文字后，需要将文字传递给主程序。字幕引擎进程通过标准输出将字幕数据传递给 electron 主进程。
+
+传递的内容必须是 JSON 字符串，其中 JSON 对象需要包含的参数如下：

 ```typescript
 export interface CaptionItem {
@@ -36,10 +96,15 @@ export interface CaptionItem {
 }
 ```

+**注意必须确保咱们一起每输出一次字幕 JSON 数据就得刷新缓冲区，确保 electron 主进程每次接收到的字符串都可以被解释为 JSON 对象。**
+
 如果使用 python 语言，可以参考以下方式将数据传递给主程序：

 ```python
-# python-subprocess\audio2text\gummy.py
+# caption-engine\main-gummy.py
+sys.stdout.reconfigure(line_buffering=True)
+
+# caption-engine\audio2text\gummy.py
 ...
    def send_to_node(self, data):
        """
@@ -84,4 +149,4 @@ export interface CaptionItem {

 ## 参考代码

-本项目 `python-subprocess` 文件夹下的 `main-gummy.py` 文件为默认字幕引擎的入口代码。`src\main\utils\engine.ts` 为服务端获取字幕引擎数据和进行处理的代码。可以根据需要阅读了解字幕引擎的实现细节和完整运行过程。
+本项目 `caption-engine` 文件夹下的 `main-gummy.py` 文件为默认字幕引擎的入口代码。`src\main\utils\engine.ts` 为服务端获取字幕引擎数据和进行处理的代码。可以根据需要阅读了解字幕引擎的实现细节和完整运行过程。
--- a/assets/img/01.png
+++ b/assets/img/01.png
--- a/docs/img/02_en.png
+++ b/docs/img/02_en.png
--- a/docs/img/02_ja.png
+++ b/docs/img/02_ja.png
--- a/docs/img/02_zh.png
+++ b/docs/img/02_zh.png
--- a/docs/img/03.png
+++ b/docs/img/03.png
--- a/docs/img/04.png
+++ b/docs/img/04.png
--- a/docs/img/05.png
+++ b/docs/img/05.png
--- a/docs/user-manual/en.md
+++ b/docs/user-manual/en.md
@@ -0,0 +1,88 @@
+# Auto Caption User Manual
+
+Corresponding Version: v0.3.0
+
+## Software Introduction
+
+Auto Caption is a cross-platform caption display software that can real-time capture system audio input (recording) or output (playback) streaming data and use an audio-to-text model to generate captions for the corresponding audio. The default caption engine provided by the software (using Alibaba Cloud Gummy model) supports recognition and translation in nine languages (Chinese, English, Japanese, Korean, German, French, Russian, Spanish, Italian).
+
+Currently, the default caption engine of the software only has full functionality on Windows and macOS platforms. Additional configuration is required to capture system audio output on macOS.
+
+On Linux platforms, it can only generate captions for audio input (microphone), and currently does not support generating captions for audio output (playback).
+
+![](../../assets/media/main_en.png)
+
+### Software Limitations
+
+To use the default caption service, you need to obtain an API KEY from Alibaba Cloud.
+
+Additional configuration is required to capture audio output on macOS platform.
+
+The software is built using Electron, so the software size is inevitably large.
+
+## Software Usage
+
+### Preparing the Alibaba Cloud Model Studio API KEY
+
+To use the default caption engine (Alibaba Cloud Gummy), you need to obtain an API KEY from the Alibaba Cloud Model Studio and configure it in your local environment variables.
+
+**The international version of Alibaba Cloud does not provide the Gummy model, so non-Chinese users currently cannot use the default caption engine. I am trying to develop a new local caption engine to ensure that all users have access to a default caption engine.**
+
+Alibaba Cloud provides detailed tutorials for this:
+
+- [Obtain API KEY (Chinese)](https://help.aliyun.com/zh/model-studio/get-api-key)
+- [Configure API Key in Environment Variables (Chinese)](https://help.aliyun.com/zh/model-studio/configure-api-key-through-environment-variables)
+
+### Capturing System Audio Output on macOS
+
+> Based on the [Setup Multi-Output Device](https://github.com/ExistentialAudio/BlackHole/wiki/Multi-Output-Device) tutorial
+
+The caption engine cannot directly capture system audio output on macOS platform and requires additional driver installation. The current caption engine uses [BlackHole](https://github.com/ExistentialAudio/BlackHole). First open Terminal and execute one of the following commands (recommended to choose the first one):
+
+```bash
+brew install blackhole-2ch
+brew install blackhole-16ch
+brew install blackhole-64ch
+```
+
+![](../img/03.png)
+
+After installation completes, open `Audio MIDI Setup` (searchable via `cmd + space`). Check if BlackHole appears in the device list - if not, restart your computer.
+
+![](../img/04.png)
+
+Once BlackHole is confirmed installed, in the `Audio MIDI Setup` page, click the plus (+) button at bottom left and select "Create Multi-Output Device". Include both BlackHole and your desired audio output destination in the outputs. Finally, set this multi-output device as your default audio output device.
+
+![](../img/05.png)
+
+Now the caption engine can capture system audio output and generate captions.
+
+### Modifying Settings
+
+Caption settings can be divided into three categories: general settings, caption engine settings, and caption style settings. Note that changes to general settings take effect immediately. For the other two categories, after making changes, you need to click the "Apply" option in the upper right corner of the corresponding settings module for the changes to take effect. If you click "Cancel Changes," the current modifications will not be saved and will revert to the previous state.
+
+### Starting and Stopping Captions
+
+After completing all configurations, click the "Start Caption Engine" button on the interface to start the captions. If you need a separate caption display window, click the "Open Caption Window" button to activate the independent caption display window. To pause caption recognition, click the "Stop Caption Engine" button.
+
+### Adjusting the Caption Display Window
+
+The following image shows the caption display window, which displays the latest captions in real-time. The three buttons in the upper right corner of the window have the following functions: pin the window to the front, open the caption control window, and close the caption display window. The width of the window can be adjusted by moving the mouse to the left or right edge of the window and dragging the mouse.
+
+![](../img/01.png)
+
+### Exporting Caption Records
+
+In the caption control window, you can see the records of all collected captions. Click the "Export Caption Records" button to export the caption records as a JSON file.
+
+## Caption Engine
+
+The so-called caption engine is actually a subprocess that real-time captures system audio input (recording) or output (playback) streaming data and uses an audio-to-text model to generate captions for the corresponding audio. The generated captions are output as JSON data converted to strings and returned to the main program. The main program reads the caption data, processes it, and displays it in the window.
+
+The software provides a default caption engine. If you need other caption engines, you can call them by enabling the custom engine option (other engines need to be developed specifically for this software). The engine path is the path to the custom caption engine on your computer, and the engine command is the runtime parameters for the custom caption engine, which need to be filled out according to the rules of the specific caption engine.
+
+![](../img/02_en.png)
+
+Note that when using a custom caption engine, all previous caption engine settings will be ineffective, and the configuration of the custom caption engine is entirely done through the engine command.
+
+If you are a developer and want to develop a custom caption engine, please refer to the [Caption Engine Explanation Document](../engine-manual/en.md).
--- a/docs/user-manual/ja.md
+++ b/docs/user-manual/ja.md
@@ -0,0 +1,91 @@
+# Auto Caption ユーザーマニュアル
+
+対応バージョン：v0.3.0
+
+この文書は大規模モデルを使用して翻訳されていますので、内容に正確でない部分があるかもしれません。
+
+## ソフトウェアの概要
+
+Auto Caption は、クロスプラットフォームの字幕表示ソフトウェアで、システムの音声入力（録音）または出力（音声再生）のストリーミングデータをリアルタイムで取得し、音声からテキストに変換するモデルを利用して対応する音声の字幕を生成します。このソフトウェアが提供するデフォルトの字幕エンジン（アリババクラウド Gummy モデルを使用）は、9つの言語（中国語、英語、日本語、韓国語、ドイツ語、フランス語、ロシア語、スペイン語、イタリア語）の認識と翻訳をサポートしています。
+
+現在、ソフトウェアのデフォルト字幕エンジンは Windows と macOS プラットフォームでのみ完全な機能を有しています。macOS でシステムオーディオ出力を取得するには追加の設定が必要です。
+
+Linux プラットフォームでは、オーディオ入力（マイク）からの字幕生成のみ可能で、現在オーディオ出力（再生音）からの字幕生成はサポートしていません。
+
+![](../../assets/media/main_ja.png)
+
+### ソフトウェアの欠点
+
+デフォルトの字幕サービスを使用するには、アリババクラウドの API KEY を取得する必要があります。
+
+macOS プラットフォームでオーディオ出力を取得するには追加の設定が必要です。
+
+ソフトウェアは Electron で構築されているため、そのサイズは避けられないほど大きいです。
+
+## ソフトウェアの使用方法
+
+### 百炼プラットフォームの API KEY の準備
+
+ソフトウェアが提供するデフォルトの字幕エンジン（アリババクラウド Gummy）を使用するには、アリババクラウド百炼プラットフォームから API KEY を取得し、ローカル環境変数に設定する必要があります。
+
+**アリババクラウドの国際版には Gummy モデルが提供されていないため、中国以外のユーザーは現在、デフォルトの字幕エンジンを使用できません。すべてのユーザーが利用できるように、新しいローカルの字幕エンジンを開発中です。**
+
+アリババクラウドは詳細なチュートリアルを提供していますので、以下のリンクを参照してください：
+
+- [API KEY の取得（中国語）](https://help.aliyun.com/zh/model-studio/get-api-key)
+- [環境変数を通じて API Key を設定する（中国語）](https://help.aliyun.com/zh/model-studio/configure-api-key-through-environment-variables)
+
+### macOS でのシステムオーディオ出力の取得方法
+
+> [マルチ出力デバイスの設定](https://github.com/ExistentialAudio/BlackHole/wiki/Multi-Output-Device) チュートリアルに基づいて作成
+
+
+字幕エンジンは macOS プラットフォームで直接システムオーディオ出力を取得できず、追加のドライバーインストールが必要です。現在の字幕エンジンでは [BlackHole](https://github.com/ExistentialAudio/BlackHole) を使用しています。まずターミナルを開き、以下のいずれかのコマンドを実行してください（最初のオプションを推奨します）：
+
+```bash
+brew install blackhole-2ch
+brew install blackhole-16ch
+brew install blackhole-64ch
+```
+
+![](../img/03.png)
+
+インストール完了後、`オーディオMIDI設定`（`cmd + space`で検索可能）を開きます。デバイスリストにBlackHoleが表示されているか確認してください - 表示されていない場合はコンピュータを再起動してください。
+
+![](../img/04.png)
+
+BlackHoleのインストールが確認できたら、`オーディオ MIDI 設定`ページで左下のプラス(+)ボタンをクリックし、「マルチ出力デバイスを作成」を選択します。出力に BlackHole と希望するオーディオ出力先の両方を含めてください。最後に、このマルチ出力デバイスをデフォルトのオーディオ出力デバイスに設定します。
+
+![](../img/05.png)
+
+これで字幕エンジンがシステムオーディオ出力をキャプチャし、字幕を生成できるようになります。
+
+### 設定の変更
+
+字幕の設定は3つのカテゴリーに分かれます：一般的な設定、字幕エンジンの設定、字幕スタイルの設定。注意すべき点として、一般的な設定の変更は即座に適用されます。しかし、他の2つの設定については、変更後に該当する設定モジュール右上の「適用」オプションをクリックすることで初めて変更が有効になります。「変更を取り消す」を選択すると、現在の変更は保存されず、前回の状態に戻ります。
+
+### 字幕の開始と停止
+
+すべての設定を完了したら、インターフェースの「字幕エンジンを開始」ボタンをクリックして字幕を開始できます。独立した字幕表示ウィンドウが必要な場合は、インターフェースの「字幕ウィンドウを開く」ボタンをクリックして独立した字幕表示ウィンドウをアクティブ化します。字幕認識を一時停止する必要がある場合は、「字幕エンジンを停止」ボタンをクリックします。
+
+### 字幕表示ウィンドウの調整
+
+下の図は字幕表示ウィンドウです。このウィンドウは現在の最新の字幕をリアルタイムで表示します。ウィンドウの右上にある3つのボタンの機能はそれぞれ次の通りです：ウィンドウを最前面に固定する、字幕制御ウィンドウを開く、字幕表示ウィンドウを閉じる。このウィンドウの幅は調整可能です。マウスをウィンドウの左右の端に移動し、ドラッグして幅を調整します。
+
+![](../img/01.png)
+
+### 字幕記録のエクスポート
+
+字幕制御ウィンドウでは、現在収集されたすべての字幕の記録を見ることができます。「字幕記録をエクスポート」ボタンをクリックすると、字幕記録をJSONファイルとしてエクスポートできます。
+
+## 字幕エンジン
+
+字幕エンジンとは、実際にはサブプログラムであり、システムの音声入力（録音）または出力（音声再生）のストリーミングデータをリアルタイムで取得し、音声からテキストに変換するモデルを利用して対応する音声の字幕を生成します。生成された字幕はIPC経由で文字列に変換されたJSONデータとして出力され、メインプログラムに返されます。メインプログラムは字幕データを読み取り、処理してウィンドウ上に表示します。
+
+ソフトウェアはデフォルトの字幕エンジンを提供しており、他の字幕エンジンが必要な場合は、カスタムエンジンオプションを開いて他の字幕エンジンを呼び出すことができます（他のエンジンはこのソフトウェアに対して開発する必要があります）。エンジンパスは、あなたのコンピュータ上のカスタム字幕エンジンのパスであり、エンジンコマンドはカスタム字幕エンジンの実行パラメータです。これらの部分は、その字幕エンジンの規則に従って記入する必要があります。
+
+![](../img/02_ja.png)
+
+カスタム字幕エンジンを使用する場合、前の字幕エンジンの設定はすべて無効になります。カスタム字幕エンジンの設定は完全にエンジンコマンドによって行われます。
+
+開発者の方で、カスタム字幕エンジンを開発したい場合は、[字幕エンジン説明文書](../engine-manual/ja.md)をご覧ください。
--- a/docs/user-manual/zh.md
+++ b/docs/user-manual/zh.md
@@ -0,0 +1,91 @@
+# Auto Caption 用户手册
+
+对应版本：v0.3.0
+
+## 软件简介
+
+Auto Caption 是一个跨平台的字幕显示软件，能够实时获取系统音频输入（录音）或输出（播放声音）的流式数据，并调用音频转文字的模型生成对应音频的字幕。软件提供的默认字幕引擎（使用阿里云 Gummy 模型）支持九种语言（中、英、日、韩、德、法、俄、西、意）的识别与翻译。
+
+目前软件默认字幕引擎只有在 Windows 和 macOS 平台下才拥有完整功能，在 macOS 要获取系统音频输出需要额外配置。
+
+在 Linux 平台下只能生成音频输入（麦克风）的字幕，暂不支持音频输出（播放声音）的字幕生成。
+
+![](../../assets/media/main_zh.png)
+
+### 软件缺点
+
+要使用默认字幕服务需要获取阿里云的 API KEY。
+
+在 macOS 平台获取音频输出需要额外配置。
+
+软件使用 Electron 构建，因此软件体积不可避免的较大。
+
+## 软件使用
+
+### 准备阿里云百炼平台 API KEY
+
+要使用软件提供的默认字幕引擎（阿里云 Gummy），需要从阿里云百炼平台获取 API KEY，然后将 API KEY 添加到软件设置中或者配置到环境变量中（仅 Windows 平台支持读取环境变量中的 API KEY）。
+
+![](../../assets/media/api_zh.png)
+
+**国际版的阿里云服务并没有提供 Gummy 模型，因此目前非中国用户无法使用默认字幕引擎。我正在开发新的本地字幕引擎，以确保所有用户都有默认字幕引擎可以使用。**
+
+这部分阿里云提供了详细的教程，可参考：
+
+- [获取 API KEY](https://help.aliyun.com/zh/model-studio/get-api-key)
+
+- [将 API Key 配置到环境变量](https://help.aliyun.com/zh/model-studio/configure-api-key-through-environment-variables)
+
+### macOS 获取系统音频输出
+
+> 基于 [Setup Multi-Output Device](https://github.com/ExistentialAudio/BlackHole/wiki/Multi-Output-Device) 教程编写
+
+字幕引擎无法在 macOS 平台直接获取系统的音频输出，需要安装额外的驱动。目前字幕引擎采用的是 [BlackHole](https://github.com/ExistentialAudio/BlackHole)。首先打开终端，执行以下命令中的其中一个（建议选择第一个）：
+
+```bash
+brew install blackhole-2ch
+brew install blackhole-16ch
+brew install blackhole-64ch
+```
+
+![](../img/03.png)
+
+安装完成后打开 `音频 MIDI 设置`（`cmd + space` 打开搜索，可以搜索到）。观察设备列表中是否有 BlackHole 设备，如果没有需要重启电脑。
+
+![](../img/04.png)
+
+在确定安装好 BlackHole 设备后，在 `音频 MIDI 设置` 页面，点击左下角的加号，选择“创建多输出设备”。在输出中包含 BlackHole 和你想要的音频输出目标。最后将该多输出设备设置为默认音频输出设备。
+
+![](../img/05.png)
+
+现在字幕引擎就能捕获系统的音频输出并生成字幕了。
+
+### 修改设置
+
+字幕设置可以分为三类：通用设置、字幕引擎设置、字幕样式设置。需要注意的是，修改通用设置是立即生效的。但是对于其他两类设置，修改后需要点击对应设置模块右上角的“应用”选项，更改才会真正生效。如果点击“取消更改”那么当前修改将不会被保存，而是回退到上次修改的状态。
+
+### 启动和关闭字幕
+
+在修改完全部配置后，点击界面的“启动字幕引擎”按钮，即可启动字幕。如果需要独立的字幕展示窗口，单击界面的“打开字幕窗口”按钮即可激活独立的字幕展示窗口。如果需要暂停字幕识别，单击界面的“关闭字幕引擎”按钮即可。
+
+### 调整字幕展示窗口
+
+如下图为字幕展示窗口，该窗口实时展示当前最新字幕。窗口右上角三个按钮的功能分别是：将窗口固定在最前面、打开字幕控制窗口、关闭字幕展示窗口。该窗口宽度可以调整，将鼠标移动至窗口的左右边缘，拖动鼠标即可调整宽度。
+
+![](../img/01.png)
+
+### 字幕记录的导出
+
+在字幕控制窗口中可以看到当前收集的所有字幕的记录，点击“导出字幕记录”按钮，即可将字幕记录导出为 JSON 文件。
+
+## 字幕引擎
+
+所谓的字幕引擎实际上是一个子程序，它会实时获取系统音频输入（录音）或输出（播放声音）的流式数据，并调用音频转文字的模型生成对应音频的字幕。生成的字幕通过 IPC 输出为转换为字符串的 JSON 数据，并返回给主程序。主程序读取字幕数据，处理后显示在窗口上。
+
+软件提供了一个默认的字幕引擎，如果你需要其他的字幕引擎，可以通过打开自定义引擎选项来调用其他字幕引擎（其他引擎需要针对该软件进行开发）。其中引擎路径是自定义字幕引擎在你的电脑上的路径，引擎指令是自定义字幕引擎的运行参数，这部分需要按该字幕引擎的规则进行填写。
+
+![](../img/02_zh.png)
+
+注意使用自定义字幕引擎时，前面的字幕引擎的设置将全部不起作用，自定义字幕引擎的配置完全通过引擎指令进行配置。
+
+如果你是开发者，想开发自定义字幕引擎，请查看[字幕引擎说明文档](../engine-manual/zh.md)。
--- a/electron-builder.yml
+++ b/electron-builder.yml
@@ -10,8 +10,8 @@ files:
  - '!{.env,.env.*,.npmrc,pnpm-lock.yaml}'
  - '!{tsconfig.json,tsconfig.node.json,tsconfig.web.json}'
 extraResources:
-  from: ./python-subprocess/dist/main-gummy.exe
-  to: ./python-subprocess/dist/main-gummy.exe
+  from: ./caption-engine/dist/main-gummy
+  to: ./caption-engine/main-gummy
 asarUnpack:
  - resources/**
 win:
--- a/python-prototype/gummy.ipynb
+++ b/python-prototype/gummy.ipynb
@@ -2,11 +2,11 @@
 "cells": [
  {
   "cell_type": "code",
-   "execution_count": 1,
+   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
-    "from dashscope.audio.asr import *\n",
+    "from dashscope.audio.asr import * # type: ignore\n",
    "import pyaudiowpatch as pyaudio\n",
    "import numpy as np\n",
    "\n",
@@ -107,19 +107,19 @@
     "text": [
      "\n",
      "采样输入设备：\n",
-      "    - 序号：37\n",
+      "    - 序号：26\n",
      "    - 名称：耳机 (HUAWEI FreeLace 活力版) [Loopback]\n",
      "    - 最大输入通道数：2\n",
      "    - 默认低输入延迟：0.003s\n",
      "    - 默认高输入延迟：0.01s\n",
-      "    - 默认采样率：44100.0Hz\n",
+      "    - 默认采样率：48000.0Hz\n",
      "    - 是否回环设备：True\n",
      "\n",
-      "音频样本块大小：4410\n",
+      "音频样本块大小：4800\n",
      "样本位宽：2\n",
      "音频数据格式：8\n",
      "音频通道数：2\n",
-      "音频采样率：44100\n",
+      "音频采样率：48000\n",
      "\n"
     ]
    }
--- a/engine-test/resample.ipynb
+++ b/engine-test/resample.ipynb
@@ -0,0 +1,189 @@
+{
+ "cells": [
+  {
+   "cell_type": "code",
+   "execution_count": 7,
+   "id": "1e12f3ef",
+   "metadata": {},
+   "outputs": [
+    {
+     "name": "stdout",
+     "output_type": "stream",
+     "text": [
+      "\n",
+      "        采样输入设备：\n",
+      "            - 设备类型：音频输出\n",
+      "            - 序号：0\n",
+      "            - 名称：BlackHole 2ch\n",
+      "            - 最大输入通道数：2\n",
+      "            - 默认低输入延迟：0.01s\n",
+      "            - 默认高输入延迟：0.1s\n",
+      "            - 默认采样率：48000.0Hz\n",
+      "\n",
+      "        音频样本块大小：2400\n",
+      "        样本位宽：2\n",
+      "        采样格式：8\n",
+      "        音频通道数：2\n",
+      "        音频采样率：48000\n",
+      "        \n"
+     ]
+    }
+   ],
+   "source": [
+    "import sys\n",
+    "import os\n",
+    "import wave\n",
+    "\n",
+    "current_dir = os.getcwd() \n",
+    "sys.path.append(os.path.join(current_dir, '../caption-engine'))\n",
+    "\n",
+    "from sysaudio.darwin import AudioStream\n",
+    "from audioprcs import resampleRawChunk, mergeChunkChannels\n",
+    "\n",
+    "stream = AudioStream(0)\n",
+    "stream.printInfo()"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": 5,
+   "id": "a72914f4",
+   "metadata": {},
+   "outputs": [
+    {
+     "name": "stdout",
+     "output_type": "stream",
+     "text": [
+      "Recording...\n",
+      "Done\n"
+     ]
+    }
+   ],
+   "source": [
+    "\"\"\"获取系统音频输出5秒，然后保存为wav文件\"\"\"\n",
+    "\n",
+    "with wave.open('output.wav', 'wb') as wf:\n",
+    "    wf.setnchannels(stream.CHANNELS)\n",
+    "    wf.setsampwidth(stream.SAMP_WIDTH)\n",
+    "    wf.setframerate(stream.RATE)\n",
+    "    stream.openStream()\n",
+    "\n",
+    "    print('Recording...')\n",
+    "\n",
+    "    for _ in range(0, 100):\n",
+    "        chunk = stream.read_chunk()\n",
+    "        if isinstance(chunk, bytes):\n",
+    "            wf.writeframes(chunk)\n",
+    "        else:\n",
+    "            raise Exception('Error: chunk is not bytes')\n",
+    "        \n",
+    "    stream.closeStream()    \n",
+    "    print('Done')"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": 8,
+   "id": "a6e8a098",
+   "metadata": {},
+   "outputs": [
+    {
+     "name": "stdout",
+     "output_type": "stream",
+     "text": [
+      "Recording...\n",
+      "Done\n"
+     ]
+    }
+   ],
+   "source": [
+    "\"\"\"获取系统音频输入，转换为单通道音频，持续5秒，然后保存为wav文件\"\"\"\n",
+    "\n",
+    "with wave.open('output.wav', 'wb') as wf:\n",
+    "    wf.setnchannels(1)\n",
+    "    wf.setsampwidth(stream.SAMP_WIDTH)\n",
+    "    wf.setframerate(stream.RATE)\n",
+    "    stream.openStream()\n",
+    "\n",
+    "    print('Recording...')\n",
+    "\n",
+    "    for _ in range(0, 100):\n",
+    "        chunk = mergeChunkChannels(\n",
+    "            stream.read_chunk(),\n",
+    "            stream.CHANNELS\n",
+    "        )\n",
+    "        if isinstance(chunk, bytes):\n",
+    "            wf.writeframes(chunk)\n",
+    "        else:\n",
+    "            raise Exception('Error: chunk is not bytes')\n",
+    "        \n",
+    "    stream.closeStream()    \n",
+    "    print('Done')"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": 4,
+   "id": "aaca1465",
+   "metadata": {},
+   "outputs": [
+    {
+     "name": "stdout",
+     "output_type": "stream",
+     "text": [
+      "Recording...\n",
+      "Done\n"
+     ]
+    }
+   ],
+   "source": [
+    "\"\"\"获取系统音频输入，转换为单通道音频并重采样到16000Hz，持续5秒，然后保存为wav文件\"\"\"\n",
+    "\n",
+    "with wave.open('output.wav', 'wb') as wf:\n",
+    "    wf.setnchannels(1)\n",
+    "    wf.setsampwidth(stream.SAMP_WIDTH)\n",
+    "    wf.setframerate(16000)\n",
+    "    stream.openStream()\n",
+    "\n",
+    "    print('Recording...')\n",
+    "\n",
+    "    for _ in range(0, 100):\n",
+    "        chunk = resampleRawChunk(\n",
+    "            stream.read_chunk(),\n",
+    "            stream.CHANNELS,\n",
+    "            stream.RATE,\n",
+    "            16000,\n",
+    "            mode=\"sinc_best\"\n",
+    "        )\n",
+    "        if isinstance(chunk, bytes):\n",
+    "            wf.writeframes(chunk)\n",
+    "        else:\n",
+    "            raise Exception('Error: chunk is not bytes')\n",
+    "        \n",
+    "    stream.closeStream()    \n",
+    "    print('Done')"
+   ]
+  }
+ ],
+ "metadata": {
+  "kernelspec": {
+   "display_name": ".venv",
+   "language": "python",
+   "name": "python3"
+  },
+  "language_info": {
+   "codemirror_mode": {
+    "name": "ipython",
+    "version": 3
+   },
+   "file_extension": ".py",
+   "mimetype": "text/x-python",
+   "name": "python",
+   "nbconvert_exporter": "python",
+   "pygments_lexer": "ipython3",
+   "version": "3.9.6"
+  }
+ },
+ "nbformat": 4,
+ "nbformat_minor": 5
+}
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,27 +1,26 @@
 {
  "name": "auto-caption",
-  "version": "0.0.1",
+  "version": "0.3.0",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
      "name": "auto-caption",
-      "version": "0.0.1",
+      "version": "0.3.0",
      "hasInstallScript": true,
      "dependencies": {
        "@electron-toolkit/preload": "^3.0.1",
        "@electron-toolkit/utils": "^4.0.0",
        "ant-design-vue": "^4.2.6",
        "pinia": "^3.0.2",
-        "vue-router": "^4.5.1",
-        "ws": "^8.18.2"
+        "vue-i18n": "^11.1.9",
+        "vue-router": "^4.5.1"
      },
      "devDependencies": {
        "@electron-toolkit/eslint-config-prettier": "3.0.0",
        "@electron-toolkit/eslint-config-ts": "^3.0.0",
        "@electron-toolkit/tsconfig": "^1.0.1",
        "@types/node": "^22.14.1",
-        "@types/ws": "^8.18.1",
        "@vitejs/plugin-vue": "^5.2.3",
        "electron": "^35.1.5",
        "electron-builder": "^25.1.8",
@@ -459,9 +458,9 @@
      }
    },
    "node_modules/@electron/asar/node_modules/brace-expansion": {
-      "version": "1.1.11",
-      "resolved": "https://registry.npmmirror.com/brace-expansion/-/brace-expansion-1.1.11.tgz",
-      "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
+      "version": "1.1.12",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz",
+      "integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==",
      "dev": true,
      "license": "MIT",
      "dependencies": {
@@ -1278,9 +1277,9 @@
      }
    },
    "node_modules/@eslint/config-array/node_modules/brace-expansion": {
-      "version": "1.1.11",
-      "resolved": "https://registry.npmmirror.com/brace-expansion/-/brace-expansion-1.1.11.tgz",
-      "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
+      "version": "1.1.12",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz",
+      "integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==",
      "dev": true,
      "license": "MIT",
      "dependencies": {
@@ -1349,9 +1348,9 @@
      }
    },
    "node_modules/@eslint/eslintrc/node_modules/brace-expansion": {
-      "version": "1.1.11",
-      "resolved": "https://registry.npmmirror.com/brace-expansion/-/brace-expansion-1.1.11.tgz",
-      "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
+      "version": "1.1.12",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz",
+      "integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==",
      "dev": true,
      "license": "MIT",
      "dependencies": {
@@ -1492,6 +1491,50 @@
        "url": "https://github.com/sponsors/nzakas"
      }
    },
+    "node_modules/@intlify/core-base": {
+      "version": "11.1.9",
+      "resolved": "https://registry.npmmirror.com/@intlify/core-base/-/core-base-11.1.9.tgz",
+      "integrity": "sha512-Lrdi4wp3XnGhWmB/mMD/XtfGUw1Jt+PGpZI/M63X1ZqhTDjNHRVCs/i8vv8U1cwaj1A9fb0bkCQHLSL0SK+pIQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@intlify/message-compiler": "11.1.9",
+        "@intlify/shared": "11.1.9"
+      },
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      }
+    },
+    "node_modules/@intlify/message-compiler": {
+      "version": "11.1.9",
+      "resolved": "https://registry.npmmirror.com/@intlify/message-compiler/-/message-compiler-11.1.9.tgz",
+      "integrity": "sha512-84SNs3Ikjg0rD1bOuchzb3iK1vR2/8nxrkyccIl5DjFTeMzE/Fxv6X+A7RN5ZXjEWelc1p5D4kHA6HEOhlKL5Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@intlify/shared": "11.1.9",
+        "source-map-js": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      }
+    },
+    "node_modules/@intlify/shared": {
+      "version": "11.1.9",
+      "resolved": "https://registry.npmmirror.com/@intlify/shared/-/shared-11.1.9.tgz",
+      "integrity": "sha512-H/83xgU1l8ox+qG305p6ucmoy93qyjIPnvxGWRA7YdOoHe1tIiW9IlEu4lTdsOR7cfP1ecrwyflQSqXdXBacXA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      }
+    },
    "node_modules/@isaacs/cliui": {
      "version": "8.0.2",
      "resolved": "https://registry.npmmirror.com/@isaacs/cliui/-/cliui-8.0.2.tgz",
@@ -2281,16 +2324,6 @@
      "license": "MIT",
      "optional": true
    },
-    "node_modules/@types/ws": {
-      "version": "8.18.1",
-      "resolved": "https://registry.npmmirror.com/@types/ws/-/ws-8.18.1.tgz",
-      "integrity": "sha512-ThVF6DCVhA8kUGy+aazFQ4kXQ7E1Ty7A3ypFOe0IcJV8O/M511G99AW24irKrW56Wt44yG9+ij8FaqoBGkuBXg==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@types/node": "*"
-      }
-    },
    "node_modules/@types/yauzl": {
      "version": "2.10.3",
      "resolved": "https://registry.npmmirror.com/@types/yauzl/-/yauzl-2.10.3.tgz",
@@ -3321,9 +3354,9 @@
      "optional": true
    },
    "node_modules/brace-expansion": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmmirror.com/brace-expansion/-/brace-expansion-2.0.1.tgz",
-      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
      "dev": true,
      "license": "MIT",
      "dependencies": {
@@ -4325,9 +4358,9 @@
      }
    },
    "node_modules/dir-compare/node_modules/brace-expansion": {
-      "version": "1.1.11",
-      "resolved": "https://registry.npmmirror.com/brace-expansion/-/brace-expansion-1.1.11.tgz",
-      "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
+      "version": "1.1.12",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz",
+      "integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==",
      "dev": true,
      "license": "MIT",
      "dependencies": {
@@ -5113,9 +5146,9 @@
      }
    },
    "node_modules/eslint/node_modules/brace-expansion": {
-      "version": "1.1.11",
-      "resolved": "https://registry.npmmirror.com/brace-expansion/-/brace-expansion-1.1.11.tgz",
-      "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
+      "version": "1.1.12",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz",
+      "integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==",
      "dev": true,
      "license": "MIT",
      "dependencies": {
@@ -5805,9 +5838,9 @@
      }
    },
    "node_modules/glob/node_modules/brace-expansion": {
-      "version": "1.1.11",
-      "resolved": "https://registry.npmmirror.com/brace-expansion/-/brace-expansion-1.1.11.tgz",
-      "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
+      "version": "1.1.12",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz",
+      "integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==",
      "dev": true,
      "license": "MIT",
      "dependencies": {
@@ -6462,9 +6495,9 @@
      }
    },
    "node_modules/jake/node_modules/brace-expansion": {
-      "version": "1.1.11",
-      "resolved": "https://registry.npmmirror.com/brace-expansion/-/brace-expansion-1.1.11.tgz",
-      "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
+      "version": "1.1.12",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz",
+      "integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==",
      "dev": true,
      "license": "MIT",
      "dependencies": {
@@ -9430,6 +9463,32 @@
        "node": ">=10"
      }
    },
+    "node_modules/vue-i18n": {
+      "version": "11.1.9",
+      "resolved": "https://registry.npmmirror.com/vue-i18n/-/vue-i18n-11.1.9.tgz",
+      "integrity": "sha512-N9ZTsXdRmX38AwS9F6Rh93RtPkvZTkSy/zNv63FTIwZCUbLwwrpqlKz9YQuzFLdlvRdZTnWAUE5jMxr8exdl7g==",
+      "license": "MIT",
+      "dependencies": {
+        "@intlify/core-base": "11.1.9",
+        "@intlify/shared": "11.1.9",
+        "@vue/devtools-api": "^6.5.0"
+      },
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      },
+      "peerDependencies": {
+        "vue": "^3.0.0"
+      }
+    },
+    "node_modules/vue-i18n/node_modules/@vue/devtools-api": {
+      "version": "6.6.4",
+      "resolved": "https://registry.npmmirror.com/@vue/devtools-api/-/devtools-api-6.6.4.tgz",
+      "integrity": "sha512-sGhTPMuXqZ1rVOk32RylztWkfXTRhuS7vgAKv0zjqk8gbsHkJ7xfFf+jbySxt7tWObEJwyKaHMikV/WGDiQm8g==",
+      "license": "MIT"
+    },
    "node_modules/vue-router": {
      "version": "4.5.1",
      "resolved": "https://registry.npmmirror.com/vue-router/-/vue-router-4.5.1.tgz",
@@ -9581,27 +9640,6 @@
      "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==",
      "license": "ISC"
    },
-    "node_modules/ws": {
-      "version": "8.18.2",
-      "resolved": "https://registry.npmmirror.com/ws/-/ws-8.18.2.tgz",
-      "integrity": "sha512-DMricUmwGZUVr++AEAe2uiVM7UoO9MAVZMDu05UQOaUII0lp+zOzLLU4Xqh/JvTqklB1T4uELaaPBKyjE1r4fQ==",
-      "license": "MIT",
-      "engines": {
-        "node": ">=10.0.0"
-      },
-      "peerDependencies": {
-        "bufferutil": "^4.0.1",
-        "utf-8-validate": ">=5.0.2"
-      },
-      "peerDependenciesMeta": {
-        "bufferutil": {
-          "optional": true
-        },
-        "utf-8-validate": {
-          "optional": true
-        }
-      }
-    },
    "node_modules/xml-name-validator": {
      "version": "4.0.0",
      "resolved": "https://registry.npmmirror.com/xml-name-validator/-/xml-name-validator-4.0.0.tgz",
--- a/package.json
+++ b/package.json
@@ -1,6 +1,7 @@
 {
  "name": "auto-caption",
-  "version": "0.1.0",
+  "productName": "Auto Caption",
+  "version": "0.3.0",
  "description": "A cross-platform subtitle display software.",
  "main": "./out/main/index.js",
  "author": "himeditator",
@@ -25,15 +26,14 @@
    "@electron-toolkit/utils": "^4.0.0",
    "ant-design-vue": "^4.2.6",
    "pinia": "^3.0.2",
-    "vue-router": "^4.5.1",
-    "ws": "^8.18.2"
+    "vue-i18n": "^11.1.9",
+    "vue-router": "^4.5.1"
  },
  "devDependencies": {
    "@electron-toolkit/eslint-config-prettier": "3.0.0",
    "@electron-toolkit/eslint-config-ts": "^3.0.0",
    "@electron-toolkit/tsconfig": "^1.0.1",
    "@types/node": "^22.14.1",
-    "@types/ws": "^8.18.1",
    "@vitejs/plugin-vue": "^5.2.3",
    "electron": "^35.1.5",
    "electron-builder": "^25.1.8",
--- a/python-prototype/requirements.txt
+++ b/python-prototype/requirements.txt
@@ -1,4 +0,0 @@
-numpy
-dashscope
-pyaudio
-pyaudiowpatch
--- a/python-subprocess/main-gummy.py
+++ b/python-subprocess/main-gummy.py
@@ -1,48 +0,0 @@
-import sys
-
-if sys.platform == 'win32':
-    from sysaudio.win import AudioStream, mergeStreamChannels
-elif sys.platform == 'linux':
-    from sysaudio.linux import AudioStream, mergeStreamChannels
-else:
-    raise NotImplementedError(f"Unsupported platform: {sys.platform}")
-
-from audio2text.gummy import GummyTranslator
-import sys
-import argparse
-
-def convert_audio_to_text(s_lang, t_lang, audio_type):
-    sys.stdout.reconfigure(line_buffering=True)
-    stream = AudioStream(audio_type)
-    stream.openStream()
-
-    if t_lang == 'none':
-        gummy = GummyTranslator(stream.RATE, s_lang, None)
-    else:
-        gummy = GummyTranslator(stream.RATE, s_lang, t_lang)
-    gummy.translator.start()
-
-    while True:
-        try:
-            if not stream.stream: continue
-            data = stream.stream.read(stream.CHUNK)
-            data = mergeStreamChannels(data, stream.CHANNELS)
-            gummy.translator.send_audio_frame(data)
-        except KeyboardInterrupt:
-            stream.closeStream()
-            gummy.translator.stop()
-            break
-
-
-if __name__ == "__main__":
-    parser = argparse.ArgumentParser(description='Convert system audio stream to text')
-    parser.add_argument('-s', '--source_language', default='en', help='Source language code')
-    parser.add_argument('-t', '--target_language', default='zh', help='Target language code')
-    parser.add_argument('-a', '--audio_type', default='0', help='Audio stream source: 0 for output audio stream, 1 for input audio stream')
-    args = parser.parse_args()
-    convert_audio_to_text(
-        args.source_language,
-        args.target_language,
-        0 if args.audio_type == '0' else 1
-    )
-    
--- a/python-subprocess/requirements.txt
+++ b/python-subprocess/requirements.txt
--- a/resources/icon.png
+++ b/resources/icon.png
--- a/src/main/CaptionWindow.ts
+++ b/src/main/CaptionWindow.ts
@@ -1,14 +1,13 @@
 import { shell, BrowserWindow, ipcMain } from 'electron'
 import path from 'path'
 import { is } from '@electron-toolkit/utils'
-import icon from '../../resources/icon.png?asset'
-import { controlWindow } from './control'
-import { sendStyles, sendCaptionLog } from './utils/config'
+import icon from '../../build/icon.png?asset'
+import { controlWindow } from './ControlWindow'

-class CaptionWindow { 
+class CaptionWindow {
  window: BrowserWindow | undefined;
-  
-  public createWindow(): void { 
+
+  public createWindow(): void {
    this.window = new BrowserWindow({
      icon: icon,
      width: 900,
@@ -17,22 +16,15 @@ class CaptionWindow {
      show: false,
      frame: false,
      transparent: true,
-      alwaysOnTop: true,
      center: true,
      autoHideMenuBar: true,
-      ...(process.platform === 'linux' ? { icon } : {}),
      webPreferences: {
        preload: path.join(__dirname, '../preload/index.js'),
        sandbox: false
      }
    })
-  
-    setTimeout(() => {
-      if (this.window) {
-        sendStyles(this.window);
-        sendCaptionLog(this.window, 'set');
-      }
-    }, 1000);
+
+    this.window.setAlwaysOnTop(true, 'screen-saver')

    this.window.on('ready-to-show', () => {
      this.window?.show()
@@ -46,7 +38,7 @@ class CaptionWindow {
      shell.openExternal(details.url)
      return { action: 'deny' }
    })
-  
+
    if (is.dev && process.env['ELECTRON_RENDERER_URL']) {
      this.window.loadURL(`${process.env['ELECTRON_RENDERER_URL']}/#/caption`)
    } else {
@@ -57,7 +49,6 @@ class CaptionWindow {
  }

  public handleMessage() {
-    // 字幕窗口请求创建控制窗口
    ipcMain.on('caption.controlWindow.activate', () => {
      if(!controlWindow.window){
        controlWindow.createWindow()
@@ -66,22 +57,23 @@ class CaptionWindow {
        controlWindow.window.show()
      }
    })
-    // 字幕窗口高度发生变化
+
    ipcMain.on('caption.windowHeight.change', (_, height) => {
      if(this.window){
-        this.window.setSize(this.window.getSize()[0], height) 
+        this.window.setSize(this.window.getSize()[0], height)
      }
    })
-    // 关闭字幕窗口
+
    ipcMain.on('caption.window.close', () => {
      if(this.window){
        this.window.close()
      }
    })
-    // 是否固定在最前面
+
    ipcMain.on('caption.pin.set', (_, pinned) => {
      if(this.window){
-        this.window.setAlwaysOnTop(pinned)
+        if(pinned) this.window.setAlwaysOnTop(true, 'screen-saver')
+        else this.window.setAlwaysOnTop(false)
      }
    })
  }
--- a/src/main/ControlWindow.ts
+++ b/src/main/ControlWindow.ts
@@ -0,0 +1,138 @@
+import { shell, BrowserWindow, ipcMain, nativeTheme } from 'electron'
+import path from 'path'
+import { is } from '@electron-toolkit/utils'
+import icon from '../../build/icon.png?asset'
+import { captionWindow } from './CaptionWindow'
+import { allConfig } from './utils/AllConfig'
+import { captionEngine } from './utils/CaptionEngine'
+
+class ControlWindow {
+  window: BrowserWindow | undefined;
+
+  public createWindow(): void {
+    this.window = new BrowserWindow({
+      icon: icon,
+      width: 1200,
+      height: 800,
+      minWidth: 750,
+      minHeight: 500,
+      show: false,
+      center: true,
+      autoHideMenuBar: true,
+      webPreferences: {
+        preload: path.join(__dirname, '../preload/index.js'),
+        sandbox: false
+      }
+    })
+
+    allConfig.readConfig()
+
+    this.window.on('ready-to-show', () => {
+      this.window?.show()
+    })
+
+    this.window.on('closed', () => {
+      this.window = undefined
+      allConfig.writeConfig()
+    })
+
+    this.window.webContents.setWindowOpenHandler((details) => {
+      shell.openExternal(details.url)
+      return { action: 'deny' }
+    })
+
+    if (is.dev && process.env['ELECTRON_RENDERER_URL']) {
+      this.window.loadURL(process.env['ELECTRON_RENDERER_URL'])
+    } else {
+      this.window.loadFile(path.join(__dirname, '../renderer/index.html'))
+    }
+  }
+
+  public handleMessage() {
+    nativeTheme.on('updated', () => {
+      if(allConfig.uiTheme === 'system'){
+        if(nativeTheme.shouldUseDarkColors && this.window){
+          this.window.webContents.send('control.nativeTheme.change', 'dark')
+        }
+        else if(!nativeTheme.shouldUseDarkColors && this.window){
+          this.window.webContents.send('control.nativeTheme.change', 'light')
+        }
+      }
+    })
+
+    ipcMain.handle('both.window.mounted', () => {
+      return allConfig.getFullConfig()
+    })
+
+    ipcMain.handle('control.nativeTheme.get', () => {
+      if(allConfig.uiTheme === 'system'){
+        if(nativeTheme.shouldUseDarkColors) return 'dark'
+        return 'light'
+      }
+      return allConfig.uiTheme
+    })
+
+    ipcMain.on('control.uiLanguage.change', (_, args) => {
+      allConfig.uiLanguage = args
+      if(captionWindow.window){
+        captionWindow.window.webContents.send('control.uiLanguage.set', args)
+      }
+    })
+
+    ipcMain.on('control.uiTheme.change', (_, args) => {
+      allConfig.uiTheme = args
+    })
+
+    ipcMain.on('control.leftBarWidth.change', (_, args) => {
+      allConfig.leftBarWidth = args
+    })
+
+    ipcMain.on('control.styles.change', (_, args) => {
+      allConfig.setStyles(args)
+      if(captionWindow.window){
+        allConfig.sendStyles(captionWindow.window)
+      }
+    })
+
+    ipcMain.on('control.styles.reset', () => {
+      allConfig.resetStyles()
+      if(this.window){
+        allConfig.sendStyles(this.window)
+      }
+      if(captionWindow.window){
+        allConfig.sendStyles(captionWindow.window)
+      }
+    })
+
+    ipcMain.on('control.captionWindow.activate', () => {
+      if(!captionWindow.window){
+        captionWindow.createWindow()
+      }
+      else {
+        captionWindow.window.show()
+      }
+    })
+
+    ipcMain.on('control.controls.change', (_, args) => {
+      allConfig.setControls(args)
+    })
+
+    ipcMain.on('control.engine.start', () => {
+      captionEngine.start()
+    })
+
+    ipcMain.on('control.engine.stop', () => {
+      captionEngine.stop()
+    })
+
+    ipcMain.on('control.captionLog.clear', () => {
+      allConfig.captionLog.splice(0)
+    })
+  }
+
+  public sendErrorMessage(message: string) {
+    this.window?.webContents.send('control.error.occurred', message)
+  }
+}
+
+export const controlWindow = new ControlWindow()
--- a/src/main/control.ts
+++ b/src/main/control.ts
@@ -1,136 +0,0 @@
-import { shell, BrowserWindow, ipcMain } from 'electron'
-import path from 'path'
-import { is } from '@electron-toolkit/utils'
-import icon from '../../resources/icon.png?asset'
-import { captionWindow } from './caption'
-import {
-  captionEngine,
-  captionLog,
-  controls,
-  setStyles,
-  resetStyles,
-  sendStyles,
-  sendCaptionLog,
-  setControls,
-  sendControls,
-  readConfig,
-  writeConfig
-} from './utils/config'
-
-class ControlWindow {
-  window: BrowserWindow | undefined;
-
-  public createWindow(): void {
-    this.window = new BrowserWindow({
-      icon: icon,
-      width: 1200,
-      height: 800,
-      minWidth: 900,
-      minHeight: 600,
-      show: false,
-      center: true,
-      autoHideMenuBar: true,
-      ...(process.platform === 'linux' ? { icon } : {}),
-      webPreferences: {
-        preload: path.join(__dirname, '../preload/index.js'),
-        sandbox: false
-      }
-    })
-
-    setTimeout(() => {
-      if (this.window) {
-        readConfig()
-        sendStyles(this.window) // 配置初始样式
-        sendCaptionLog(this.window, 'set') // 配置当前字幕记录
-        sendControls(this.window) // 配置字幕引擎配置
-      }
-    }, 1000);
-    
-
-    this.window.on('ready-to-show', () => {
-      this.window?.show()
-    })
-  
-    this.window.on('closed', () => {
-      this.window = undefined
-      writeConfig()
-    })
-  
-    this.window.webContents.setWindowOpenHandler((details) => {
-      shell.openExternal(details.url)
-      return { action: 'deny' }
-    })
-  
-    if (is.dev && process.env['ELECTRON_RENDERER_URL']) {
-      this.window.loadURL(process.env['ELECTRON_RENDERER_URL'])
-    } else {
-      this.window.loadFile(path.join(__dirname, '../renderer/index.html'))
-    }
-  }
-
-  public handleMessage() {
-    // 控制窗口样式更新
-    ipcMain.on('control.style.change', (_, args) => {
-      setStyles(args)
-      if(captionWindow.window){
-        sendStyles(captionWindow.window)
-      }
-    })
-    ipcMain.on('control.style.reset', () => {
-      resetStyles()
-      if(captionWindow.window){
-        sendStyles(captionWindow.window)
-      }
-      if(this.window){
-        sendStyles(this.window)
-      }
-    })
-    // 控制窗口请求创建字幕窗口
-    ipcMain.on('control.captionWindow.activate', () => {
-      if(!captionWindow.window){
-        captionWindow.createWindow()
-      }
-      else {
-        captionWindow.window.show()
-      }
-    })
-    // 字幕引擎控制配置更新并启动引擎
-    ipcMain.on('control.control.change', (_, args) => {
-      setControls(args)
-    })
-    // 启动字幕引擎
-    ipcMain.on('control.engine.start', () => {
-      if(controls.engineEnabled){
-        this.window?.webContents.send('control.engine.already')
-      }
-      else {
-        if(
-          process.env.DASHSCOPE_API_KEY ||
-          (controls.customized && controls.customizedApp)
-        ) {
-          if(this.window){
-            captionEngine.start(this.window)
-          }
-        }
-        else {
-          this.sendErrorMessage('没有检测到 DASHSCOPE_API_KEY 环境变量，如果要使用 gummy 引擎，需要在阿里云百炼平台获取 API Key 并添加到本机环境变量')
-        }
-      }
-    })
-    // 停止字幕引擎
-    ipcMain.on('control.engine.stop', () => {
-      captionEngine.stop()
-      this.window?.webContents.send('control.engine.stopped')
-    })
-    // 清空字幕记录
-    ipcMain.on('control.caption.clear', () => {
-      captionLog.splice(0)
-    })
-  }
-
-  public sendErrorMessage(message: string) {
-    this.window?.webContents.send('control.error.send', message)
-  }
-}
-
-export const controlWindow = new ControlWindow()
--- a/src/main/i18n/index.ts
+++ b/src/main/i18n/index.ts
@@ -0,0 +1,11 @@
+import zh from './lang/zh'
+import en from './lang/en'
+import ja from './lang/ja'
+import { allConfig } from '../utils/AllConfig'
+
+export function i18n(key: string): string{
+  if(allConfig.uiLanguage === 'zh') return zh[key] || key
+  else if(allConfig.uiLanguage === 'en') return en[key] || key
+  else if(allConfig.uiLanguage === 'ja') return ja[key] || key
+  else return key
+}
--- a/src/main/i18n/lang/en.ts
+++ b/src/main/i18n/lang/en.ts
@@ -0,0 +1,8 @@
+export default {
+  "gummy.key.missing": "API KEY is not set, and the DASHSCOPE_API_KEY environment variable is not detected. To use the gummy engine, you need to obtain an API KEY from the Alibaba Cloud Bailian platform and add it to the settings or configure it in the local environment variables.",
+  "platform.unsupported": "Unsupported platform: ",
+  "engine.start.error": "Caption engine failed to start: ",
+  "engine.output.parse.error": "Unable to parse caption engine output as a JSON object: ",
+  "engine.error": "Caption engine error: ",
+  "engine.shutdown.error": "Failed to shut down the caption engine process: "
+}
--- a/src/main/i18n/lang/ja.ts
+++ b/src/main/i18n/lang/ja.ts
@@ -0,0 +1,8 @@
+export default {
+  "gummy.key.missing": "API KEY が設定されておらず、DASHSCOPE_API_KEY 環境変数も検出されていません。Gummy エンジンを使用するには、Alibaba Cloud Bailian プラットフォームから API KEY を取得し、設定に追加するか、ローカルの環境変数に設定する必要があります。",
+  "platform.unsupported": "サポートされていないプラットフォーム: ",
+  "engine.start.error": "字幕エンジンの起動に失敗しました: ",
+  "engine.output.parse.error": "字幕エンジンの出力を JSON オブジェクトとして解析できませんでした: ",
+  "engine.error": "字幕エンジンエラー: ",
+  "engine.shutdown.error": "字幕エンジンプロセスの終了に失敗しました: "
+}
--- a/src/main/i18n/lang/zh.ts
+++ b/src/main/i18n/lang/zh.ts
@@ -0,0 +1,8 @@
+export default {
+  "gummy.key.missing": "没有设置 API KEY，也没有检测到 DASHSCOPE_API_KEY 环境变量。如果要使用 gummy 引擎，需要在阿里云百炼平台获取 API KEY，并在添加到设置中或者配置到本机环境变量。",
+  "platform.unsupported": "不支持的平台：",
+  "engine.start.error": "字幕引擎启动失败：",
+  "engine.output.parse.error": "字幕引擎输出内容无法解析为 JSON 对象：",
+  "engine.error": "字幕引擎错误：",
+  "engine.shutdown.error": "字幕引擎进程关闭失败："
+}
--- a/src/main/index.ts
+++ b/src/main/index.ts
@@ -1,8 +1,9 @@
 import { app, BrowserWindow } from 'electron'
 import { electronApp, optimizer } from '@electron-toolkit/utils'
-import { controlWindow } from './control'
-import { captionWindow } from './caption'
-import { captionEngine, writeConfig } from './utils/config'
+import { controlWindow } from './ControlWindow'
+import { captionWindow } from './CaptionWindow'
+import { allConfig } from './utils/AllConfig'
+import { captionEngine } from './utils/CaptionEngine'

 app.whenReady().then(() => {
  electronApp.setAppUserModelId('com.himeditator.autocaption')
@@ -23,9 +24,9 @@ app.whenReady().then(() => {
  })
 })

-app.on('will-quit', async () => { 
+app.on('will-quit', async () => {
  captionEngine.stop()
-  writeConfig()
+  allConfig.writeConfig()
 });

 app.on('window-all-closed', () => {
--- a/src/main/types/index.ts
+++ b/src/main/types/index.ts
@@ -1,13 +1,39 @@
+export type UILanguage =  "zh" | "en" | "ja"
+
+export type UITheme = "light" | "dark" | "system"
+
+export interface Controls {
+  engineEnabled: boolean,
+  sourceLang: string,
+  targetLang: string,
+  engine: 'gummy',
+  audio: 0 | 1,
+  translation: boolean,
+  API_KEY: string,
+  customized: boolean,
+  customizedApp: string,
+  customizedCommand: string
+}
+
 export interface Styles {
+  lineBreak: number,
  fontFamily: string,
  fontSize: number,
  fontColor: string,
+  fontWeight: number,
  background: string,
  opacity: number,
+  showPreview: boolean,
  transDisplay: boolean,
  transFontFamily: string,
  transFontSize: number,
-  transFontColor: string
+  transFontColor: string,
+  transFontWeight: number,
+  textShadow: boolean,
+  offsetX: number,
+  offsetY: number,
+  blur: number,
+  textShadowColor: string
 }

 export interface CaptionItem {
@@ -18,14 +44,12 @@ export interface CaptionItem {
  translation: string
 }

-export interface Controls {
-  engineEnabled: boolean,
-  sourceLang: string,
-  targetLang: string,
-  engine: string,
-  audio: 0 | 1,
-  translation: boolean,
-  customized: boolean,
-  customizedApp: string,
-  customizedCommand: string
-}
+export interface FullConfig {
+  platform: string,
+  uiLanguage: UILanguage,
+  uiTheme: UITheme,
+  leftBarWidth: number,
+  styles: Styles,
+  controls: Controls,
+  captionLog: CaptionItem[]
+}
--- a/src/main/utils/AllConfig.ts
+++ b/src/main/utils/AllConfig.ts
@@ -0,0 +1,158 @@
+import {
+  UILanguage, UITheme, Styles, Controls,
+  CaptionItem, FullConfig
+} from '../types'
+import { app, BrowserWindow } from 'electron'
+import * as path from 'path'
+import * as fs from 'fs'
+
+const defaultStyles: Styles = {
+  lineBreak: 1,
+  fontFamily: 'sans-serif',
+  fontSize: 24,
+  fontColor: '#000000',
+  fontWeight: 4,
+  background: '#dbe2ef',
+  opacity: 80,
+  showPreview: true,
+  transDisplay: true,
+  transFontFamily: 'sans-serif',
+  transFontSize: 24,
+  transFontColor: '#000000',
+  transFontWeight: 4,
+  textShadow: false,
+  offsetX: 2,
+  offsetY: 2,
+  blur: 0,
+  textShadowColor: '#ffffff'
+};
+
+const defaultControls: Controls = {
+  sourceLang: 'en',
+  targetLang: 'zh',
+  engine: 'gummy',
+  audio: 0,
+  engineEnabled: false,
+  API_KEY: '',
+  translation: true,
+  customized: false,
+  customizedApp: '',
+  customizedCommand: ''
+};
+
+
+class AllConfig {
+  uiLanguage: UILanguage = 'zh';
+  leftBarWidth: number = 8;
+  uiTheme: UITheme = 'system';
+  styles: Styles = {...defaultStyles};
+  controls: Controls = {...defaultControls};
+  captionLog: CaptionItem[] = [];
+
+  constructor() {}
+
+  public readConfig() {
+    const configPath = path.join(app.getPath('userData'), 'config.json')
+    if(fs.existsSync(configPath)){
+      const config = JSON.parse(fs.readFileSync(configPath, 'utf-8'))
+      if(config.uiLanguage) this.uiLanguage = config.uiLanguage
+      if(config.uiTheme) this.uiTheme = config.uiTheme
+      if(config.leftBarWidth) this.leftBarWidth = config.leftBarWidth
+      if(config.styles) this.setStyles(config.styles)
+      if(process.platform !== 'win32' && process.platform !== 'darwin') config.controls.audio = 1
+      if(config.controls) this.setControls(config.controls)
+      console.log('[INFO] Read Config from:', configPath)
+    }
+  }
+
+  public writeConfig() {
+    const config = {
+      uiLanguage: this.uiLanguage,
+      uiTheme: this.uiTheme,
+      leftBarWidth: this.leftBarWidth,
+      controls: this.controls,
+      styles: this.styles
+    }
+    const configPath = path.join(app.getPath('userData'), 'config.json')
+    fs.writeFileSync(configPath, JSON.stringify(config, null, 2))
+    console.log('[INFO] Write Config to:', configPath)
+  }
+
+  public getFullConfig(): FullConfig {
+    return {
+      platform: process.platform,
+      uiLanguage: this.uiLanguage,
+      uiTheme: this.uiTheme,
+      leftBarWidth: this.leftBarWidth,
+      styles: this.styles,
+      controls: this.controls,
+      captionLog: this.captionLog
+    }
+  }
+
+  public setStyles(args: Object) {
+    for(let key in this.styles) {
+      if(key in args) {
+        this.styles[key] = args[key]
+      }
+    }
+    console.log('[INFO] Set Styles:', this.styles)
+  }
+
+  public resetStyles() {
+    this.setStyles(defaultStyles)
+  }
+
+  public sendStyles(window: BrowserWindow) {
+    window.webContents.send('both.styles.set', this.styles)
+    console.log(`[INFO] Send Styles to #${window.id}:`, this.styles)
+  }
+
+  public setControls(args: Object) {
+    const engineEnabled = this.controls.engineEnabled
+    for(let key in this.controls){
+      if(key in args) {
+        this.controls[key] = args[key]
+      }
+    }
+    this.controls.engineEnabled = engineEnabled
+    console.log('[INFO] Set Controls:', this.controls)
+  }
+
+  public sendControls(window: BrowserWindow) {
+    window.webContents.send('control.controls.set', this.controls)
+    console.log(`[INFO] Send Controls to #${window.id}:`, this.controls)
+  }
+
+  public updateCaptionLog(log: CaptionItem) {
+    let command: 'add' | 'upd' = 'add'
+    if(
+      this.captionLog.length &&
+      this.captionLog[this.captionLog.length - 1].index === log.index &&
+      this.captionLog[this.captionLog.length - 1].time_s === log.time_s
+    ) {
+      this.captionLog.splice(this.captionLog.length - 1, 1, log)
+      command = 'upd'
+    }
+    else {
+      this.captionLog.push(log)
+    }
+    for(const window of BrowserWindow.getAllWindows()){
+      this.sendCaptionLog(window, command)
+    }
+  }
+
+  public sendCaptionLog(window: BrowserWindow, command: 'add' | 'upd' | 'set') {
+    if(command === 'add'){
+      window.webContents.send(`both.captionLog.add`, this.captionLog[this.captionLog.length - 1])
+    }
+    else if(command === 'upd'){
+      window.webContents.send(`both.captionLog.upd`, this.captionLog[this.captionLog.length - 1])
+    }
+    else if(command === 'set'){
+      window.webContents.send(`both.captionLog.set`, this.captionLog)
+    }
+  }
+}
+
+export const allConfig = new AllConfig()
--- a/src/main/utils/CaptionEngine.ts
+++ b/src/main/utils/CaptionEngine.ts
@@ -0,0 +1,156 @@
+import { spawn, exec } from 'child_process'
+import { app } from 'electron'
+import { is } from '@electron-toolkit/utils'
+import path from 'path'
+import { controlWindow } from '../ControlWindow'
+import { allConfig } from './AllConfig'
+import { i18n } from '../i18n'
+
+export class CaptionEngine {
+  appPath: string = ''
+  command: string[] = []
+  process: any | undefined
+  processStatus: 'running' | 'stopping' | 'stopped' = 'stopped'
+
+  private getApp(): boolean {
+    if (allConfig.controls.customized && allConfig.controls.customizedApp) {
+      this.appPath = allConfig.controls.customizedApp
+      this.command = [allConfig.controls.customizedCommand]
+    }
+    else if (allConfig.controls.engine === 'gummy') {
+      allConfig.controls.customized = false
+      if(!allConfig.controls.API_KEY && !process.env.DASHSCOPE_API_KEY) {
+        controlWindow.sendErrorMessage(i18n('gummy.key.missing'))
+        return false
+      }
+      let gummyName = ''
+      if (process.platform === 'win32') {
+        gummyName = 'main-gummy.exe'
+      }
+      else if (process.platform === 'darwin' || process.platform === 'linux') {
+        gummyName = 'main-gummy'
+      }
+      else {
+        controlWindow.sendErrorMessage(i18n('platform.unsupported') + process.platform)
+        throw new Error(i18n('platform.unsupported'))
+      }
+      if (is.dev) {
+        this.appPath = path.join(
+          app.getAppPath(),
+          'caption-engine', 'dist', gummyName
+        )
+      }
+      else {
+        this.appPath = path.join(
+          process.resourcesPath, 'caption-engine', gummyName
+        )
+      }
+      this.command = []
+      this.command.push('-s', allConfig.controls.sourceLang)
+      this.command.push(
+        '-t', allConfig.controls.translation ?
+        allConfig.controls.targetLang : 'none'
+      )
+      this.command.push('-a', allConfig.controls.audio ? '1' : '0')
+      if(allConfig.controls.API_KEY) {
+        this.command.push('-k', allConfig.controls.API_KEY)
+      }
+
+      console.log('[INFO] Engine Path:', this.appPath)
+      console.log('[INFO] Engine Command:', this.command)
+    }
+    return true
+  }
+
+  public start() {
+    if (this.processStatus !== 'stopped') {
+      return
+    }
+    if(!this.getApp()){ return }
+
+    try {
+      this.process = spawn(this.appPath, this.command)
+    }
+    catch (e) {
+      controlWindow.sendErrorMessage(i18n('engine.start.error') + e)
+      console.error('[ERROR] Error starting subprocess:', e)
+      return
+    }
+
+    this.processStatus = 'running'
+    console.log('[INFO] Caption Engine Started, PID:', this.process.pid)
+
+    allConfig.controls.engineEnabled = true
+    if(controlWindow.window){
+      allConfig.sendControls(controlWindow.window)
+      controlWindow.window.webContents.send(
+        'control.engine.started',
+        this.process.pid
+      )
+    }
+
+    this.process.stdout.on('data', (data: any) => {
+      const lines = data.toString().split('\n');
+      lines.forEach((line: string) => {
+        if (line.trim()) {
+          try {
+            const caption = JSON.parse(line);
+            allConfig.updateCaptionLog(caption);
+          } catch (e) {
+            controlWindow.sendErrorMessage(i18n('engine.output.parse.error') + e)
+            console.error('[ERROR] Error parsing JSON:', e);
+          }
+        }
+      });
+    });
+
+    this.process.stderr.on('data', (data) => {
+      controlWindow.sendErrorMessage(i18n('engine.error') + data)
+      console.error(`[ERROR] Subprocess Error: ${data}`);
+    });
+
+    this.process.on('close', (code: any) => {
+      console.log(`[INFO] Subprocess exited with code ${code}`);
+      this.process = undefined;
+      allConfig.controls.engineEnabled = false
+      if(controlWindow.window){
+        allConfig.sendControls(controlWindow.window)
+        controlWindow.window.webContents.send('control.engine.stopped')
+      }
+      this.processStatus = 'stopped'
+      console.log('[INFO] Caption engine process stopped')
+    });
+  }
+
+  public stop() {
+    if(this.processStatus !== 'running') return
+    if (this.process.pid) {
+      console.log('[INFO] Trying to stop process, PID:', this.process.pid)
+      let cmd = `kill ${this.process.pid}`;
+      if (process.platform === "win32") {
+        cmd = `taskkill /pid ${this.process.pid} /t /f`
+      }
+      exec(cmd, (error) => {
+        if (error) {
+          controlWindow.sendErrorMessage(i18n('engine.shutdown.error') + error)
+          console.error(`[ERROR] Failed to kill process: ${error}`)
+        }
+      })
+    }
+    else {
+      this.process = undefined;
+      allConfig.controls.engineEnabled = false
+      if(controlWindow.window){
+        allConfig.sendControls(controlWindow.window)
+        controlWindow.window.webContents.send('control.engine.stopped')
+      }
+      this.processStatus = 'stopped'
+      console.log('[INFO] Process PID undefined, caption engine process stopped')
+      return
+    }
+    this.processStatus = 'stopping'
+    console.log('[INFO] Caption engine process stopping')
+  }
+}
+
+export const captionEngine = new CaptionEngine()
--- a/src/main/utils/config.ts
+++ b/src/main/utils/config.ts
@@ -1,123 +0,0 @@
-import { Styles, CaptionItem, Controls } from '../types'
-import { app, BrowserWindow } from 'electron'
-import { CaptionEngine } from './engine'
-import * as path from 'path'
-import * as fs from 'fs'
-
-export const captionEngine = new CaptionEngine()
-
-export const styles: Styles = {
-  fontFamily: 'sans-serif',
-  fontSize: 24,
-  fontColor: '#000000',
-  background: '#dbe2ef',
-  opacity: 80,
-  transDisplay: true,
-  transFontFamily: 'sans-serif',
-  transFontSize: 24,
-  transFontColor: '#000000'
-}
-
-export const captionLog: CaptionItem[] = []
-
-export const controls: Controls = {
-  sourceLang: 'en',
-  targetLang: 'zh',
-  engine: 'gummy',
-  audio: 0,
-  engineEnabled: false,
-  translation: true,
-  customized: false,
-  customizedApp: '',
-  customizedCommand: ''
-}
-
-export function setStyles(args: any) {
-  styles.fontFamily = args.fontFamily
-  styles.fontSize = args.fontSize
-  styles.fontColor = args.fontColor
-  styles.background = args.background
-  styles.opacity = args.opacity
-  styles.transDisplay = args.transDisplay
-  styles.transFontFamily = args.transFontFamily
-  styles.transFontSize = args.transFontSize
-  styles.transFontColor = args.transFontColor
-  console.log('[INFO] Set Styles:', styles)
-}
-
-export function resetStyles() {
-  setStyles({
-    fontFamily: 'sans-serif',
-    fontSize: 24,
-    fontColor: '#000000',
-    background: '#dbe2ef',
-    opacity: 80,
-    transDisplay: true,
-    transFontFamily: 'sans-serif',
-    transFontSize: 24,
-    transFontColor: '#000000'
-  })
-}
-
-export function sendStyles(window: BrowserWindow) {
-  window.webContents.send('caption.style.set', styles)
-  console.log(`[INFO] Send Styles to #${window.id}:`, styles)
-}
-
-export function sendCaptionLog(window: BrowserWindow, command: string) {
-  if(command === 'add'){
-    window.webContents.send(`both.log.add`, captionLog[captionLog.length - 1])
-  }
-  else if(command === 'set'){
-    window.webContents.send(`both.log.${command}`, captionLog)
-  }
-}
-
-export function addCaptionLog(log: CaptionItem) {
-  if(captionLog.length && captionLog[captionLog.length - 1].index === log.index) {
-    captionLog.splice(captionLog.length - 1, 1, log)
-  }
-  else {
-    captionLog.push(log)
-  }
-  for(const window of BrowserWindow.getAllWindows()){
-    sendCaptionLog(window, 'add')
-  }
-}
-
-export function setControls(args: any) {
-  controls.sourceLang = args.sourceLang
-  controls.targetLang = args.targetLang
-  controls.engine = args.engine
-  controls.audio = args.audio
-  controls.translation = args.translation
-  controls.customized = args.customized
-  controls.customizedApp = args.customizedApp
-  controls.customizedCommand = args.customizedCommand
-  console.log('[INFO] Set Controls:', controls)
-}
-
-export function sendControls(window: BrowserWindow) {
-  window.webContents.send('control.control.set', controls)
-  console.log(`[INFO] Send Controls to #${window.id}:`, controls)
-}
-
-export function readConfig() { 
-  const configPath = path.join(app.getPath('userData'), 'config.json')
-  if(fs.existsSync(configPath)){
-    const config = JSON.parse(fs.readFileSync(configPath, 'utf-8'))
-    setStyles(config.styles)
-    setControls(config.controls)
-    console.log('[INFO] Read Config from:', configPath)
-  }
-}
-
-export function writeConfig() {
-  const config = {
-    controls: controls,
-    styles: styles
-  }
-  const configPath = path.join(app.getPath('userData'), 'config.json')
-  fs.writeFileSync(configPath, JSON.stringify(config, null, 2))
-  console.log('[INFO] Write Config to:', configPath)
-}
--- a/src/main/utils/configSave.ts
+++ b/src/main/utils/configSave.ts
@@ -1,3 +0,0 @@
-class configSave { 
-
-}
--- a/src/main/utils/engine.ts
+++ b/src/main/utils/engine.ts
@@ -1,122 +0,0 @@
-import { spawn, exec } from 'child_process'
-import { app, BrowserWindow } from 'electron'
-import { is } from '@electron-toolkit/utils'
-import path from 'path'
-import { addCaptionLog, controls, sendControls } from './config'
-import { controlWindow } from '../control'
-
-export class CaptionEngine {
-  appPath: string = ''
-  command: string[] = []
-  process: any | undefined
-
-  private getApp() {
-    if (controls.customized && controls.customizedApp) {
-      this.appPath = controls.customizedApp
-      this.command = [controls.customizedCommand]
-    }
-    else if (controls.engine === 'gummy') {
-      controls.customized = false
-      let gummyName = ''
-      if (process.platform === 'win32') {
-        gummyName = 'main-gummy.exe'
-      }
-      else if (process.platform === 'linux') {
-        gummyName = 'main-gummy'
-      }
-      else {
-        controlWindow.sendErrorMessage('不支持的操作系统平台：' + process.platform)
-        throw new Error('Unsupported platform')
-      }
-      if (is.dev) {
-        this.appPath = path.join(
-          app.getAppPath(),
-          'python-subprocess', 'dist', gummyName
-        )
-      }
-      else {
-        this.appPath = path.join(
-          process.resourcesPath,
-          'python-subprocess', 'dist', gummyName
-        )
-      }
-      this.command = []
-      this.command.push('-s', controls.sourceLang)
-      this.command.push('-t', controls.translation ? controls.targetLang : 'none')
-      this.command.push('-a', controls.audio ? '1' : '0')
-
-      console.log('[INFO] Engine Path:', this.appPath)
-      console.log('[INFO] Engine Command:', this.command)
-    }
-  }
-
-  public start(window: BrowserWindow) {
-    if (this.process) {
-      this.stop();
-    }
-    this.getApp()
-    try {
-      this.process = spawn(this.appPath, this.command)
-    }
-    catch (e) {
-      controlWindow.sendErrorMessage('字幕引擎启动失败：' + e)
-      console.error('[ERROR] Error starting subprocess:', e)
-      return
-    }
-
-    console.log('[INFO] Caption Engine Started: ', {
-      appPath: this.appPath,
-      command: this.command
-    })
-
-    controls.engineEnabled = true
-    sendControls(window)
-    window.webContents.send('control.engine.started')
-
-    this.process.stdout.on('data', (data) => {
-      const lines = data.toString().split('\n');
-      lines.forEach((line: string) => {
-        if (line.trim()) {
-          try {
-            const caption = JSON.parse(line);
-            addCaptionLog(caption);
-          } catch (e) {
-            controlWindow.sendErrorMessage('字幕引擎输出内容无法解析为 JSON 对象：' + e)
-            console.error('[ERROR] Error parsing JSON:', e);
-          }
-        }
-      });
-    });
-
-    this.process.stderr.on('data', (data) => {
-      controlWindow.sendErrorMessage('字幕引擎错误：' + data)
-      console.error(`[ERROR] Subprocess Error: ${data}`);
-    });
-
-    this.process.on('close', (code: any) => {
-      console.log(`[INFO] Subprocess exited with code ${code}`);
-      this.process = undefined;
-      controls.engineEnabled = false
-      sendControls(window)
-    });
-  }
-
-  public stop() {
-    if (this.process) {
-      if (process.platform === "win32" && this.process.pid) {
-        exec(`taskkill /pid ${this.process.pid} /t /f`, (error) => {
-          if (error) {
-            controlWindow.sendErrorMessage('字幕引擎进程关闭失败：' + error)
-            console.error(`[ERROR] Failed to kill process: ${error}`);
-          }
-        });
-      } else {
-        this.process.kill('SIGKILL');
-      }
-    }
-    this.process = undefined;
-    controls.engineEnabled = false;
-    console.log('[INFO] Caption engine process stopped');
-    if(controlWindow.window) sendControls(controlWindow.window);
-  }
-}
--- a/src/renderer/src/App.vue
+++ b/src/renderer/src/App.vue
@@ -3,4 +3,22 @@
 </template>

 <script setup lang="ts">
+import { onMounted } from 'vue'
+import { FullConfig } from './types'
+import { useCaptionLogStore } from './stores/captionLog'
+import { useCaptionStyleStore } from './stores/captionStyle'
+import { useEngineControlStore } from './stores/engineControl'
+import { useGeneralSettingStore } from './stores/generalSetting'
+
+onMounted(() => {
+  window.electron.ipcRenderer.invoke('both.window.mounted').then((data: FullConfig) => {
+    useGeneralSettingStore().uiLanguage = data.uiLanguage
+    useGeneralSettingStore().uiTheme = data.uiTheme
+    useGeneralSettingStore().leftBarWidth = data.leftBarWidth
+    useCaptionStyleStore().setStyles(data.styles)
+    useEngineControlStore().platform = data.platform
+    useEngineControlStore().setControls(data.controls)
+    useCaptionLogStore().captionData = data.captionLog
+  })
+})
 </script>
--- a/src/renderer/src/assets/input.css
+++ b/src/renderer/src/assets/input.css
@@ -0,0 +1,29 @@
+.input-item {
+  margin: 10px 0;
+}
+
+.input-label {
+  display: inline-block;
+  width: 80px;
+  text-align: right;
+  margin-right: 10px;
+}
+
+.switch-label {
+  display: inline-block;
+  min-width: 80px;
+  text-align: right;
+  margin-right: 10px;
+}
+
+.input-area {
+  width: calc(100% - 100px);
+  min-width: 100px;
+}
+
+.input-item-value {
+  width: 80px;
+  text-align: right;
+  font-size: 12px;
+  color: var(--tag-color)
+}
--- a/src/renderer/src/assets/main.css
+++ b/src/renderer/src/assets/main.css
@@ -0,0 +1,12 @@
+:root {
+  --control-background: #fff;
+  --tag-color: rgba(0, 0, 0, 0.45);
+  --icon-color: rgba(0, 0, 0, 0.88);
+}
+
+body {
+  margin: 0;
+  padding: 0;
+  height: 100vh;
+  overflow: hidden;
+}
--- a/src/renderer/src/assets/reset.css
+++ b/src/renderer/src/assets/reset.css
@@ -1,6 +0,0 @@
-body {
-    margin: 0;
-    padding: 0;
-    height: 100vh;
-    overflow: hidden;
-}
--- a/src/renderer/src/components/CaptionControl.vue
+++ b/src/renderer/src/components/CaptionControl.vue
@@ -1,165 +0,0 @@
-<template>
-  <div style="height: 20px;"></div>
-  <a-card size="small" title="字幕控制">
-    <template #extra>
-      <a @click="applyChange">更改设置</a> |
-      <a @click="cancelChange">取消更改</a>
-    </template>
-    <div class="control-item">
-      <span class="control-label">源语言</span>
-      <a-select
-        class="control-input"
-        v-model:value="currentSourceLang"
-        :options="langList"
-      ></a-select>
-    </div>
-    <div class="control-item">
-      <span class="control-label">翻译语言</span>
-      <a-select
-        class="control-input"
-        v-model:value="currentTargetLang"
-        :options="langList.filter((item) => item.value !== 'auto')"
-      ></a-select>
-    </div>
-    <div class="control-item">
-      <span class="control-label">字幕引擎</span>
-      <a-select
-        class="control-input"
-        v-model:value="currentEngine"
-        :options="captionEngine"
-      ></a-select>
-    </div>
-    <div class="control-item">
-      <span class="control-label">音频选择</span>
-      <a-select
-        class="control-input"
-        v-model:value="currentAudio"
-        :options="audioType"
-      ></a-select>
-    </div>
-    <div class="control-item">
-      <span class="control-label">启用翻译</span>
-      <a-switch v-model:checked="currentTranslation" />
-      <span class="control-label">自定义引擎</span>
-      <a-switch v-model:checked="currentCustomized" />
-    </div>
-    <div v-show="currentCustomized">
-      <a-card size="small" title="自定义字幕引擎">
-        <p class="customize-note">说明：允许用户使用自定义字幕引擎提供字幕。提供的引擎要能通过 <code>child_process.spawn()</code> 进行启动，且需要通过 IPC 与项目 node.js 后端进行通信。具体通信接口见后端实现。</p>
-        <div class="control-item">
-          <span class="control-label">引擎路径</span>
-          <a-input
-            class="control-input"
-            v-model:value="currentCustomizedApp"
-          ></a-input>
-        </div>
-        <div class="control-item">
-          <span class="control-label">引擎指令</span>
-          <a-input
-            class="control-input"
-            v-model:value="currentCustomizedCommand"
-          ></a-input>
-        </div>
-      </a-card>
-    </div>
-  </a-card>
-  <div style="height: 20px;"></div>
-</template>
-
-<script setup lang="ts">
-import { ref, computed, watch } from 'vue'
-import { storeToRefs } from 'pinia'
-import { useCaptionControlStore } from '@renderer/stores/captionControl'
-import { notification } from 'ant-design-vue'
-
-const captionControl = useCaptionControlStore()
-const { captionEngine, audioType, changeSignal } = storeToRefs(captionControl)
-
-const currentSourceLang = ref('auto')
-const currentTargetLang = ref('zh')
-const currentEngine = ref('gummy')
-const currentAudio = ref<0 | 1>(0)
-const currentTranslation = ref<boolean>(false)
-
-const currentCustomized = ref<boolean>(false)
-const currentCustomizedApp = ref('')
-const currentCustomizedCommand = ref('')
-
-const langList = computed(() => {
-  for(let item of captionEngine.value){
-    if(item.value === currentEngine.value) {
-      return item.languages
-    }
-  }
-  return []
-})
-
-function applyChange(){
-  captionControl.sourceLang = currentSourceLang.value
-  captionControl.targetLang = currentTargetLang.value
-  captionControl.engine = currentEngine.value
-  captionControl.audio = currentAudio.value
-  captionControl.translation = currentTranslation.value
-
-  captionControl.customized = currentCustomized.value
-  captionControl.customizedApp = currentCustomizedApp.value
-  captionControl.customizedCommand = currentCustomizedCommand.value
-
-  captionControl.sendControlChange()
-
-  notification.open({
-      message: '字幕控制已更改',
-      description: '如果字幕引擎已经启动，需要关闭后重启才会生效'
-  });
-}
-
-function cancelChange(){
-  currentSourceLang.value = captionControl.sourceLang
-  currentTargetLang.value = captionControl.targetLang
-  currentEngine.value = captionControl.engine
-  currentAudio.value = captionControl.audio
-  currentTranslation.value = captionControl.translation
-
-  currentCustomized.value = captionControl.customized
-  currentCustomizedApp.value = captionControl.customizedApp
-  currentCustomizedCommand.value = captionControl.customizedCommand
-}
-
-watch(changeSignal, (val) => {
-  if(val == true) {
-    cancelChange();
-    captionControl.changeSignal = false;
-  }
-})
-</script>
-
-<style scoped>
-.control-item {
-  margin: 10px 0;
-}
-
-.control-label {
-  display: inline-block;
-  width: 80px;
-  text-align: right;
-  margin-right: 10px;
-}
-
-.customize-note {
-  padding: 0 20px;
-  color: red;
-  font-size: 12px;
-}
-
-.control-input {
-  width: calc(100% - 100px);
-  min-width: 100px;
-}
-
-.control-item-value {
-  width: 80px;
-  text-align: right;
-  font-size: 12px;
-  color: #666
-}
-</style>
--- a/src/renderer/src/components/CaptionData.vue
+++ b/src/renderer/src/components/CaptionData.vue
@@ -1,51 +1,44 @@
 <template>
-  <div class="caption-stat">
-    <a-row>
-      <a-col :span="6">
-        <a-statistic title="字幕引擎" :value="(customized && customizedApp)?'自定义':engine" />
-      </a-col>
-      <a-col :span="6">
-        <a-statistic title="字幕引擎状态" :value="engineEnabled?'已启动':'未启动'" />
-      </a-col>
-      <a-col :span="6">
-        <a-statistic title="已记录字幕" :value="captionData.length" />
-      </a-col>
-    </a-row>    
-  </div>
-
-  <div class="caption-control">
-    <a-button
-      type="primary"
-      class="control-button"
-      @click="openCaptionWindow"
-    >打开字幕窗口</a-button>
-    <a-button
-      class="control-button"
-      @click="captionControl.startEngine"
-    >启动字幕引擎</a-button>
-    <a-button 
-     danger class="control-button"
-     @click="captionControl.stopEngine"
-    >关闭字幕引擎</a-button>
-  </div>
-
  <div class="caption-list">
-    <div class="caption-title">
-      <span style="margin-right: 30px;">字幕记录</span>
+    <div>
+      <a-app class="caption-title">
+        <span style="margin-right: 30px;">{{ $t('log.title') }}</span>
+      </a-app>
      <a-button
        type="primary"
        style="margin-right: 20px;"
        @click="exportCaptions"
        :disabled="captionData.length === 0"
-      >
-        导出字幕记录
-      </a-button>
+      >{{ $t('log.export') }}</a-button>
+
+    <a-popover :title="$t('log.copyOptions')">
+      <template #content>
+        <div class="input-item">
+          <span class="input-label">{{ $t('log.addIndex') }}</span>
+          <a-switch v-model:checked="showIndex" />
+          <span class="input-label">{{ $t('log.copyTime') }}</span>
+          <a-switch v-model:checked="copyTime" />
+        </div>
+        <div class="input-item">
+          <span class="input-label">{{ $t('log.copyContent') }}</span>
+          <a-radio-group v-model:value="copyOption">
+            <a-radio-button value="both">{{ $t('log.both') }}</a-radio-button>
+            <a-radio-button value="source">{{ $t('log.source') }}</a-radio-button>
+            <a-radio-button value="target">{{ $t('log.translation') }}</a-radio-button>
+          </a-radio-group>
+        </div>
+      </template>
+      <a-button
+        style="margin-right: 20px;"
+        @click="copyCaptions"
+        :disabled="captionData.length === 0"
+      >{{ $t('log.copy') }}</a-button>
+      </a-popover>
+
      <a-button
        danger
        @click="clearCaptions"
-      >
-        清空字幕记录
-      </a-button>
+      >{{ $t('log.clear') }}</a-button>
    </div>
    <a-table
      :columns="columns"
@@ -77,17 +70,23 @@
 import { ref } from 'vue'
 import { storeToRefs } from 'pinia'
 import { useCaptionLogStore } from '@renderer/stores/captionLog'
-import { useCaptionControlStore } from '@renderer/stores/captionControl'
+import { message } from 'ant-design-vue'
+import { useI18n } from 'vue-i18n'
+const { t } = useI18n()
+
 const captionLog = useCaptionLogStore()
 const { captionData } = storeToRefs(captionLog)
-const captionControl = useCaptionControlStore()
-const { engineEnabled, engine, customized, customizedApp } = storeToRefs(captionControl)
+
+const showIndex = ref(true)
+const copyTime = ref(true)
+const copyOption = ref('both')
+
 const pagination = ref({
  current: 1,
  pageSize: 10,
  showSizeChanger: true,
  pageSizeOptions: ['10', '20', '50'],
-  showTotal: (total: number) => `共 ${total} 条记录`,
+  showTotal: (total: number) => `Total: ${total}`,
  onChange: (page: number, pageSize: number) => {
    pagination.value.current = page
    pagination.value.pageSize = pageSize
@@ -100,28 +99,24 @@ const pagination = ref({

 const columns = [
  {
-    title: '序号',
+    title: 'index',
    dataIndex: 'index',
    key: 'index',
    width: 80,
  },
  {
-    title: '时间',
+    title: 'time',
    dataIndex: 'time',
    key: 'time',
    width: 160,
  },
  {
-    title: '字幕内容',
+    title: 'content',
    dataIndex: 'content',
    key: 'content',
  },
 ]

-function openCaptionWindow() {
-  window.electron.ipcRenderer.send('control.captionWindow.activate')
-}
-
 function exportCaptions() {
  const jsonData = JSON.stringify(captionData.value, null, 2)
  const blob = new Blob([jsonData], { type: 'application/json' })
@@ -136,33 +131,36 @@ function exportCaptions() {
  URL.revokeObjectURL(url)
 }

+function copyCaptions() {
+  let content = ''
+  for(let i = 0; i < captionData.value.length; i++){
+    const item = captionData.value[i]
+    if(showIndex.value) content += `${i+1}\n`
+    if(copyTime.value) content += `${item.time_s} --> ${item.time_t}\n`.replace(/\./g, ',')
+    if(copyOption.value === 'both') content += `${item.text}\n${item.translation}\n\n`
+    else if(copyOption.value === 'source') content += `${item.text}\n\n`
+    else content += `${item.translation}\n\n`
+  }
+  navigator.clipboard.writeText(content)
+  message.success(t('log.copySuccess'))
+}
+
 function clearCaptions() {
  captionLog.clear()
 }
 </script>

 <style scoped>
-.caption-control {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: center;
-  margin: 30px;
-}
-
-.control-button {
-  height: 40px;
-  margin: 20px;
-  font-size: 16px;
-}
+@import url(../assets/input.css);

 .caption-list {
-  background: #fff;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
 }

 .caption-title {
+  display: inline-block;
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 10px;
@@ -189,14 +187,12 @@ function clearCaptions() {

 .caption-text {
  font-size: 16px;
-  color: #333;
  margin-bottom: 4px;
 }

 .caption-translation {
  font-size: 14px;
-  color: #666;
  padding-left: 16px;
  border-left: 3px solid #1890ff;
 }
-</style>
+</style>
--- a/src/renderer/src/components/CaptionStyle.vue
+++ b/src/renderer/src/components/CaptionStyle.vue
@@ -1,124 +1,214 @@
 <template>
-  <a-card size="small" title="字幕样式设置">
+  <a-card size="small" :title="$t('style.title')">
    <template #extra>
-      <a @click="applyStyle">应用样式</a> |
-      <a @click="backStyle">取消更改</a> |
-      <a @click="resetStyle">恢复默认</a>
+      <a @click="applyStyle">{{ $t('style.applyStyle') }}</a> |
+      <a @click="backStyle">{{ $t('style.cancelChange') }}</a> |
+      <a @click="resetStyle">{{ $t('style.resetStyle') }}</a>
    </template>
-    <div class="style-item">
-      <span class="style-label">字体族</span>
-      <a-input
-        class="style-input"
-        v-model:value="currentFontFamily"
-      />   
+
+    <div class="input-item">
+      <span class="input-label">{{ $t('style.longCaption') }}</span>
+      <a-select
+        class="input-area"
+        v-model:value="currentLineBreak"
+        :options="captionStyle.iBreakOptions"
+      ></a-select>
    </div>
-    <div class="style-item">
-      <span class="style-label">字体颜色</span>
+
+    <div class="input-item">
+      <span class="input-label">{{ $t('style.fontFamily') }}</span>
      <a-input
-        class="style-input"
+        class="input-area"
+        v-model:value="currentFontFamily"
+      />
+    </div>
+
+    <div class="input-item">
+      <span class="input-label">{{ $t('style.fontColor') }}</span>
+      <a-input
+        class="input-area"
        type="color"
        v-model:value="currentFontColor"
      />
-      <div class="style-item-value">{{ currentFontColor }}</div>
+      <div class="input-item-value">{{ currentFontColor }}</div>
    </div>
-    <div class="style-item">
-      <span class="style-label">字体大小</span>
+    <div class="input-item">
+      <span class="input-label">{{ $t('style.fontSize') }}</span>
      <a-input
-        class="style-input"
+        class="input-area"
        type="range"
        min="0" max="64"
        v-model:value="currentFontSize"
-      />  
-      <div class="style-item-value">{{ currentFontSize }}px</div> 
+      />
+      <div class="input-item-value">{{ currentFontSize }}px</div>
    </div>
-    <div class="style-item">
-      <span class="style-label">背景颜色</span>
+    <div class="input-item">
+      <span class="input-label">{{ $t('style.fontWeight') }}</span>
      <a-input
-        class="style-input"
+        class="input-area"
+        type="range"
+        min="1" max="9"
+        v-model:value="currentFontWeight"
+      />
+      <div class="input-item-value">{{ currentFontWeight*100 }}</div>
+    </div>
+    <div class="input-item">
+      <span class="input-label">{{ $t('style.background') }}</span>
+      <a-input
+        class="input-area"
        type="color"
        v-model:value="currentBackground"
      />
-      <div class="style-item-value">{{ currentBackground }}</div>
+      <div class="input-item-value">{{ currentBackground }}</div>
    </div>
-    <div class="style-item">
-      <span class="style-label">背景透明度</span>
+    <div class="input-item">
+      <span class="input-label">{{ $t('style.opacity') }}</span>
      <a-input
-        class="style-input"
+        class="input-area"
        type="range"
        min="0"
        max="100"
        v-model:value="currentOpacity"
      />
-      <div class="style-item-value">{{ currentOpacity }}</div>
+      <div class="input-item-value">{{ currentOpacity }}%</div>
    </div>
-    
-    <div class="style-item">
-      <span class="style-label">显示预览</span>
-      <a-switch v-model:checked="displayPreview" />
-      <span class="style-label">显示翻译</span>
-      <a-switch v-model:checked="currentTransDisplay" />
+
+    <div class="input-item">
+      <span class="input-label">{{ $t('style.preview') }}</span>
+      <a-switch v-model:checked="currentPreview" />
+      <span style="display:inline-block;width:20px;"></span>
+      <div style="display: inline-block;">
+        <span class="switch-label">{{ $t('style.translation') }}</span>
+        <a-switch v-model:checked="currentTransDisplay" />
+      </div>
+      <span style="display:inline-block;width:20px;"></span>
+      <div style="display: inline-block;">
+        <span class="switch-label">{{ $t('style.textShadow') }}</span>
+        <a-switch v-model:checked="currentTextShadow" />
+      </div>
    </div>

    <div v-show="currentTransDisplay">
-      <a-card size="small" title="翻译样式设置">
+      <a-card size="small" :title="$t('style.trans.title')">
        <template #extra>
-          <a @click="useSameStyle">使用相同样式</a>
+          <a @click="useSameStyle">{{ $t('style.trans.useSame') }}</a>
        </template>
-        <div class="style-item">
-          <span class="style-label">翻译字体</span>
+        <div class="input-item">
+          <span class="input-label">{{ $t('style.fontFamily') }}</span>
          <a-input
-            class="style-input"
+            class="input-area"
            v-model:value="currentTransFontFamily"
-          />   
+          />
        </div>
-        <div class="style-item">
-          <span class="style-label">翻译颜色</span>
+        <div class="input-item">
+          <span class="input-label">{{ $t('style.fontColor') }}</span>
          <a-input
-            class="style-input"
+            class="input-area"
            type="color"
            v-model:value="currentTransFontColor"
          />
-          <div class="style-item-value">{{ currentTransFontColor }}</div>
+          <div class="input-item-value">{{ currentTransFontColor }}</div>
        </div>
-        <div class="style-item">
-          <span class="style-label">翻译大小</span>
+        <div class="input-item">
+          <span class="input-label">{{ $t('style.fontSize') }}</span>
          <a-input
-            class="style-input"
+            class="input-area"
            type="range"
            min="0" max="64"
            v-model:value="currentTransFontSize"
-          />   
-          <div class="style-item-value">{{ currentTransFontSize }}px</div>
+          />
+          <div class="input-item-value">{{ currentTransFontSize }}px</div>
+        </div>
+        <div class="input-item">
+          <span class="input-label">{{ $t('style.fontWeight') }}</span>
+          <a-input
+            class="input-area"
+            type="range"
+            min="1" max="9"
+            v-model:value="currentTransFontWeight"
+          />
+          <div class="input-item-value">{{ currentTransFontWeight*100 }}</div>
        </div>
      </a-card>
    </div>

+    <div v-show="currentTextShadow" style="margin-top:10px;">
+      <a-card size="small" :title="$t('style.shadow.title')">
+        <div class="input-item">
+          <span class="input-label">{{ $t('style.shadow.offsetX') }}</span>
+          <a-input
+            class="input-area"
+            type="range"
+            min="-10" max="10"
+            v-model:value="currentOffsetX"
+          />
+          <div class="input-item-value">{{ currentOffsetX }}px</div>
+        </div>
+        <div class="input-item">
+          <span class="input-label">{{ $t('style.shadow.offsetY') }}</span>
+          <a-input
+            class="input-area"
+            type="range"
+            min="-10" max="10"
+            v-model:value="currentOffsetY"
+          />
+          <div class="input-item-value">{{ currentOffsetY }}px</div>
+        </div>
+        <div class="input-item">
+          <span class="input-label">{{ $t('style.shadow.blur') }}</span>
+          <a-input
+            class="input-area"
+            type="range"
+            min="0" max="10"
+            v-model:value="currentBlur"
+          />
+          <div class="input-item-value">{{ currentBlur }}px</div>
+        </div>
+        <div class="input-item">
+          <span class="input-label">{{ $t('style.shadow.color') }}</span>
+          <a-input
+            class="input-area"
+            type="color"
+            v-model:value="currentTextShadowColor"
+          />
+          <div class="input-item-value">{{ currentTextShadowColor }}</div>
+        </div>
+      </a-card>
+    </div>
  </a-card>

  <Teleport to="body">
    <div
-      v-if="displayPreview"
+      v-if="currentPreview"
      class="preview-container"
      :style="{
-        backgroundColor: addOpicityToColor(currentBackground, currentOpacity)
+        backgroundColor: addOpicityToColor(currentBackground, currentOpacity),
+        textShadow: currentTextShadow ? `${currentOffsetX}px ${currentOffsetY}px ${currentBlur}px ${currentTextShadowColor}` : 'none'
      }"
    >
-      <p class="preview-caption"
+      <p :class="[currentLineBreak?'':'left-ellipsis']"
        :style="{
          fontFamily: currentFontFamily,
          fontSize: currentFontSize + 'px',
-          color: currentFontColor
-        }">
-        {{ "This is a preview of subtitle styles." }}
+          color: currentFontColor,
+          fontWeight: currentFontWeight * 100
+      }">
+        <span v-if="captionData.length">{{ captionData[captionData.length-1].text }}</span>
+        <span v-else>{{ $t('example.original') }}</span>
      </p>
-      <p class="preview-translation" v-if="currentTransDisplay"
+      <p :class="[currentLineBreak?'':'left-ellipsis']"
+        v-if="currentTransDisplay"
        :style="{
          fontFamily: currentTransFontFamily,
          fontSize: currentTransFontSize + 'px',
-          color: currentTransFontColor  
+          color: currentTransFontColor,
+          fontWeight: currentTransFontWeight * 100
        }"
-      >这是字幕样式预览(翻译)</p>
-    </div>    
+      >
+        <span v-if="captionData.length">{{ captionData[captionData.length-1].translation }}</span>
+        <span v-else>{{ $t('example.translation') }}</span>
+      </p>
+    </div>
  </Teleport>

 </template>
@@ -127,20 +217,35 @@
 import { ref, watch } from 'vue'
 import { useCaptionStyleStore } from '@renderer/stores/captionStyle'
 import { storeToRefs } from 'pinia'
+import { notification } from 'ant-design-vue'
+import { useI18n } from 'vue-i18n'
+import { useCaptionLogStore } from '@renderer/stores/captionLog';
+const captionLog = useCaptionLogStore();
+const { captionData } = storeToRefs(captionLog);
+
+const { t } = useI18n()

 const captionStyle = useCaptionStyleStore()
 const { changeSignal } = storeToRefs(captionStyle)

+const currentLineBreak = ref<number>(0)
 const currentFontFamily = ref<string>('sans-serif')
 const currentFontSize = ref<number>(24)
 const currentFontColor = ref<string>('#000000')
+const currentFontWeight = ref<number>(4)
 const currentBackground = ref<string>('#dbe2ef')
 const currentOpacity = ref<number>(50)
+const currentPreview = ref<boolean>(true)
 const currentTransDisplay = ref<boolean>(true)
 const currentTransFontFamily = ref<string>('sans-serif')
 const currentTransFontSize = ref<number>(24)
 const currentTransFontColor = ref<string>('#000000')
-const displayPreview = ref<boolean>(true)
+const currentTransFontWeight = ref<number>(4)
+const currentTextShadow = ref<boolean>(false)
+const currentOffsetX = ref<number>(2)
+const currentOffsetY = ref<number>(2)
+const currentBlur = ref<number>(0)
+const currentTextShadowColor = ref<string>('#ffffff')

 function addOpicityToColor(color: string, opicity: number) {
  const opicityValue = Math.round(opicity * 255 / 100);
@@ -154,36 +259,57 @@ function useSameStyle(){
  currentTransFontColor.value = currentFontColor.value;
 }

-function applyStyle(){ 
+function applyStyle(){
+  captionStyle.lineBreak = currentLineBreak.value;
  captionStyle.fontFamily = currentFontFamily.value;
  captionStyle.fontSize = currentFontSize.value;
  captionStyle.fontColor = currentFontColor.value;
+  captionStyle.fontWeight = currentFontWeight.value;
  captionStyle.background = currentBackground.value;
  captionStyle.opacity = currentOpacity.value;
-
+  captionStyle.showPreview = currentPreview.value;
  captionStyle.transDisplay = currentTransDisplay.value;
  captionStyle.transFontFamily = currentTransFontFamily.value;
  captionStyle.transFontSize = currentTransFontSize.value;
  captionStyle.transFontColor = currentTransFontColor.value;
+  captionStyle.transFontWeight = currentTransFontWeight.value;
+  captionStyle.textShadow = currentTextShadow.value;
+  captionStyle.offsetX = currentOffsetX.value;
+  captionStyle.offsetY = currentOffsetY.value;
+  captionStyle.blur = currentBlur.value;
+  captionStyle.textShadowColor = currentTextShadowColor.value;

-  captionStyle.sendStyleChange();
+  captionStyle.sendStylesChange();
+
+    notification.open({
+    message: t('noti.styleChange'),
+    description: t('noti.styleInfo')
+  });
 }

 function backStyle(){
+  currentLineBreak.value = captionStyle.lineBreak;
  currentFontFamily.value = captionStyle.fontFamily;
  currentFontSize.value = captionStyle.fontSize;
  currentFontColor.value = captionStyle.fontColor;
+  currentFontWeight.value = captionStyle.fontWeight;
  currentBackground.value = captionStyle.background;
  currentOpacity.value = captionStyle.opacity;
-
+  currentPreview.value = captionStyle.showPreview;
  currentTransDisplay.value = captionStyle.transDisplay;
  currentTransFontFamily.value = captionStyle.transFontFamily;
  currentTransFontSize.value = captionStyle.transFontSize;
  currentTransFontColor.value = captionStyle.transFontColor;
+  currentTransFontWeight.value = captionStyle.transFontWeight;
+  currentTextShadow.value = captionStyle.textShadow;
+  currentOffsetX.value = captionStyle.offsetX;
+  currentOffsetY.value = captionStyle.offsetY;
+  currentBlur.value = captionStyle.blur;
+  currentTextShadowColor.value = captionStyle.textShadowColor;
 }

-function resetStyle() { 
-  captionStyle.sendStyleReset();
+function resetStyle() {
+  captionStyle.sendStylesReset();
 }

 watch(changeSignal, (val) => {
@@ -195,32 +321,16 @@ watch(changeSignal, (val) => {
 </script>

 <style scoped>
-.caption-button {
-  display: flex;
-  justify-content: center;
+@import url(../assets/input.css);
+.general-note {
+  padding: 10px 10px 0;
+  max-width: min(36vw, 400px);
 }

-.style-item {
-  margin: 10px 0;
-}
-
-.style-label {
-  display: inline-block;
-  width: 80px;
-  text-align: right;
-  margin-right: 10px;
-}
-
-.style-input {
-  width: calc(100% - 100px);
-  min-width: 100px;
-}
-
-.style-item-value {
-  width: 80px;
-  text-align: right;
-  font-size: 12px;
-  color: #666
+.hover-label {
+  color: #1668dc;
+  cursor: pointer;
+  font-weight: bold;
 }

 .preview-container {
@@ -236,7 +346,20 @@ watch(changeSignal, (val) => {
 }

 .preview-container p {
+  text-align: center;
  margin: 0;
  line-height: 1.5em;
 }
-</style>
+
+.left-ellipsis {
+  white-space: nowrap;
+  overflow: hidden;
+  direction: rtl;
+  text-align: left;
+}
+
+.left-ellipsis > span {
+  direction: ltr;
+  display: inline-block;
+}
+</style>
--- a/src/renderer/src/components/EngineControl.vue
+++ b/src/renderer/src/components/EngineControl.vue
@@ -0,0 +1,175 @@
+<template>
+  <div style="height: 20px;"></div>
+  <a-card size="small" :title="$t('engine.title')">
+    <template #extra>
+      <a @click="applyChange">{{ $t('engine.applyChange') }}</a> |
+      <a @click="cancelChange">{{ $t('engine.cancelChange') }}</a>
+    </template>
+    <div class="input-item">
+      <span class="input-label">{{ $t('engine.sourceLang') }}</span>
+      <a-select
+        class="input-area"
+        v-model:value="currentSourceLang"
+        :options="langList"
+      ></a-select>
+    </div>
+    <div class="input-item">
+      <span class="input-label">{{ $t('engine.transLang') }}</span>
+      <a-select
+        class="input-area"
+        v-model:value="currentTargetLang"
+        :options="langList.filter((item) => item.value !== 'auto')"
+      ></a-select>
+    </div>
+    <div class="input-item">
+      <span class="input-label">{{ $t('engine.captionEngine') }}</span>
+      <a-select
+        class="input-area"
+        v-model:value="currentEngine"
+        :options="captionEngine"
+      ></a-select>
+    </div>
+    <div class="input-item">
+      <span class="input-label">{{ $t('engine.audioType') }}</span>
+      <a-select
+        :disabled="platform !== 'win32' && platform !== 'darwin'"
+        class="input-area"
+        v-model:value="currentAudio"
+        :options="audioType"
+      ></a-select>
+    </div>
+    <div class="input-item">
+      <span class="input-label">{{ $t('engine.enableTranslation') }}</span>
+      <a-switch v-model:checked="currentTranslation" />
+      <span style="display:inline-block;width:20px;"></span>
+      <div style="display: inline-block;">
+        <span class="switch-label">{{ $t('engine.showMore') }}</span>
+        <a-switch v-model:checked="showMore" />
+      </div>
+    </div>
+    <a-card size="small" :title="$t('engine.custom.title')" v-show="showMore">
+      <div class="input-item">
+        <span class="input-label">{{ $t('engine.apikey') }}</span>
+        <a-input
+          class="input-area"
+          type="password"
+          v-model:value="currentAPI_KEY"
+        />
+      </div>
+      <div class="input-item">
+        <span style="margin-right:5px;">{{ $t('engine.customEngine') }}</span>
+        <a-switch v-model:checked="currentCustomized" />
+      </div>
+      <div v-show="currentCustomized">
+        <a-card size="small" :title="$t('engine.custom.title')">
+          <template #extra>
+            <a-popover>
+              <template #content>
+                <p class="customize-note">{{ $t('engine.custom.note') }}</p>
+              </template>
+              <a><InfoCircleOutlined />{{ $t('engine.custom.attention') }}</a>
+            </a-popover>
+          </template>
+          <div class="input-item">
+            <span class="input-label">{{ $t('engine.custom.app') }}</span>
+            <a-input
+              class="input-area"
+              v-model:value="currentCustomizedApp"
+            ></a-input>
+          </div>
+          <div class="input-item">
+            <span class="input-label">{{ $t('engine.custom.command') }}</span>
+            <a-input
+              class="input-area"
+              v-model:value="currentCustomizedCommand"
+            ></a-input>
+          </div>
+        </a-card>
+      </div>      
+    </a-card>
+
+  </a-card>
+  <div style="height: 20px;"></div>
+</template>
+
+<script setup lang="ts">
+import { ref, computed, watch } from 'vue'
+import { storeToRefs } from 'pinia'
+import { useEngineControlStore } from '@renderer/stores/engineControl'
+import { notification } from 'ant-design-vue'
+import { InfoCircleOutlined } from '@ant-design/icons-vue';
+import { useI18n } from 'vue-i18n'
+
+const { t } = useI18n()
+const showMore = ref(false)
+
+const engineControl = useEngineControlStore()
+const { platform, captionEngine, audioType, changeSignal } = storeToRefs(engineControl)
+
+const currentSourceLang = ref('auto')
+const currentTargetLang = ref('zh')
+const currentEngine = ref<'gummy'>('gummy')
+const currentAudio = ref<0 | 1>(0)
+const currentTranslation = ref<boolean>(false)
+const currentAPI_KEY = ref<string>('')
+const currentCustomized = ref<boolean>(false)
+const currentCustomizedApp = ref('')
+const currentCustomizedCommand = ref('')
+
+const langList = computed(() => {
+  for(let item of captionEngine.value){
+    if(item.value === currentEngine.value) {
+      return item.languages
+    }
+  }
+  return []
+})
+
+function applyChange(){
+  engineControl.sourceLang = currentSourceLang.value
+  engineControl.targetLang = currentTargetLang.value
+  engineControl.engine = currentEngine.value
+  engineControl.audio = currentAudio.value
+  engineControl.translation = currentTranslation.value
+  engineControl.API_KEY = currentAPI_KEY.value
+  engineControl.customized = currentCustomized.value
+  engineControl.customizedApp = currentCustomizedApp.value
+  engineControl.customizedCommand = currentCustomizedCommand.value
+
+  engineControl.sendControlsChange()
+
+  notification.open({
+    message: t('noti.engineChange'),
+    description: t('noti.changeInfo')
+  });
+}
+
+function cancelChange(){
+  currentSourceLang.value = engineControl.sourceLang
+  currentTargetLang.value = engineControl.targetLang
+  currentEngine.value = engineControl.engine
+  currentAudio.value = engineControl.audio
+  currentTranslation.value = engineControl.translation
+  currentAPI_KEY.value = engineControl.API_KEY
+  currentCustomized.value = engineControl.customized
+  currentCustomizedApp.value = engineControl.customizedApp
+  currentCustomizedCommand.value = engineControl.customizedCommand
+}
+
+watch(changeSignal, (val) => {
+  if(val == true) {
+    cancelChange();
+    engineControl.changeSignal = false;
+  }
+})
+</script>
+
+<style scoped>
+@import url(../assets/input.css);
+
+.customize-note {
+  padding: 10px 10px 0;
+  color: red;
+  max-width: min(40vw, 480px);
+}
+</style>
--- a/src/renderer/src/components/EngineStatus.vue
+++ b/src/renderer/src/components/EngineStatus.vue
@@ -0,0 +1,176 @@
+<template>
+  <div class="caption-stat">
+    <a-row>
+      <a-col :span="6">
+        <a-statistic
+          :title="$t('status.engine')"
+          :value="(customized && customizedApp)?$t('status.customized'):engine"
+        />
+      </a-col>
+      <a-col :span="6">
+        <a-statistic
+          :title="$t('status.status')"
+          :value="engineEnabled?$t('status.started'):$t('status.stopped')"
+        />
+      </a-col>
+      <a-col :span="6">
+        <a-statistic :title="$t('status.logNumber')" :value="captionData.length" />
+      </a-col>
+      <a-col :span="6">
+        <div class="about-tag">{{ $t('status.aboutProj') }}</div>
+          <GithubOutlined class="proj-info" @click="showAbout = true"/>
+      </a-col>
+    </a-row>
+  </div>
+
+  <div class="caption-control">
+    <a-button
+      type="primary"
+      class="control-button"
+      @click="openCaptionWindow"
+    >{{ $t('status.openCaption') }}</a-button>
+    <a-button
+      class="control-button"
+      :disabled="engineEnabled"
+      @click="startEngine"
+    >{{ $t('status.startEngine') }}</a-button>
+    <a-button
+     danger class="control-button"
+     :disabled="!engineEnabled"
+     @click="stopEngine"
+    >{{ $t('status.stopEngine') }}</a-button>
+  </div>
+
+  <a-modal v-model:open="showAbout" :title="$t('status.about.title')" :footer="null">
+    <div class="about-modal-content">
+      <h2 class="about-title">{{ $t('status.about.proj') }}</h2>
+      <p class="about-desc">{{ $t('status.about.desc') }}</p>
+      <a-divider />
+      <div class="about-info">
+        <p><b>{{ $t('status.about.version') }}</b><a-tag color="green">v0.3.0</a-tag></p>
+        <p>
+          <b>{{ $t('status.about.author') }}</b>
+          <a
+            href="https://github.com/HiMeditator"
+            target="_blank"
+          >
+            <a-tag color="blue">HiMeditator</a-tag>
+          </a>
+        </p>
+        <p>
+          <b>{{ $t('status.about.projLink') }}</b>
+          <a href="https://github.com/HiMeditator/auto-caption" target="_blank">
+            <a-tag color="blue">GitHub | auto-caption</a-tag>
+          </a>
+        </p>
+        <p>
+          <b>{{ $t('status.about.manual') }}</b>
+          <a
+            :href="`https://github.com/HiMeditator/auto-caption/tree/main/docs/user-manual/${$t('lang')}.md`"
+            target="_blank"
+          >
+            <a-tag color="blue">GitHub | user-manual/{{ $t('lang') }}.md</a-tag>
+          </a>
+        </p>
+        <p>
+          <b>{{ $t('status.about.engineDoc') }}</b>
+          <a
+            :href="`https://github.com/HiMeditator/auto-caption/tree/main/docs/engine-manual/${$t('lang')}.md`"
+            target="_blank"
+          >
+            <a-tag color="blue">GitHub | engine-manual/{{ $t('lang') }}.md</a-tag>
+          </a>
+        </p>
+      </div>
+      <div class="about-date">{{ $t('status.about.date') }}</div>
+    </div>
+  </a-modal>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import { storeToRefs } from 'pinia'
+import { useCaptionLogStore } from '@renderer/stores/captionLog'
+import { useEngineControlStore } from '@renderer/stores/engineControl'
+import { GithubOutlined } from '@ant-design/icons-vue';
+
+const showAbout = ref(false)
+
+const captionLog = useCaptionLogStore()
+const { captionData } = storeToRefs(captionLog)
+const engineControl = useEngineControlStore()
+const { engineEnabled, engine, customized, customizedApp } = storeToRefs(engineControl)
+
+function openCaptionWindow() {
+  window.electron.ipcRenderer.send('control.captionWindow.activate')
+}
+
+function startEngine() {
+  window.electron.ipcRenderer.send('control.engine.start')
+}
+
+function stopEngine() {
+  window.electron.ipcRenderer.send('control.engine.stop')
+}
+</script>
+
+<style scoped>
+.about-tag {
+  color: var(--tag-color);
+  margin-bottom: 16px;
+}
+
+.proj-info {
+  display: inline-block;
+  font-size: 24px;
+  cursor: pointer;
+  color: var(--icon-color);
+}
+
+.about-modal-content {
+  text-align: center;
+  padding: 8px 0 0 0;
+}
+
+.about-title {
+  font-size: 1.5em;
+  font-weight: bold;
+  margin-bottom: 0.2em;
+}
+
+.about-desc {
+  color: #666;
+  margin-bottom: 0.5em;
+}
+
+.about-info {
+  text-align: left;
+  display: inline-block;
+  margin: 0 auto;
+  font-size: 1em;
+}
+
+.about-info b {
+  margin-right: 1em;
+}
+
+.about-date {
+  margin-top: 1.5em;
+  color: #aaa;
+  font-size: 0.95em;
+  text-align: right;
+}
+
+.caption-control {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  margin: 30px;
+}
+
+.control-button {
+  height: 40px;
+  margin: 20px;
+  font-size: 16px;
+}
+</style>
--- a/src/renderer/src/components/GeneralSetting.vue
+++ b/src/renderer/src/components/GeneralSetting.vue
@@ -0,0 +1,63 @@
+<template>
+  <a-card size="small" :title="$t('general.title')">
+    <template #extra>
+      <a-popover>
+        <template #content>
+          <p class="general-note">{{ $t('general.note') }}</p>
+        </template>
+        <a><InfoCircleOutlined /></a>
+      </a-popover>
+    </template>
+
+    <div>
+      <div class="input-item">
+        <span class="input-label">{{ $t('general.uiLanguage') }}</span>
+        <a-radio-group v-model:value="uiLanguage">
+          <a-radio-button value="zh">中文</a-radio-button>
+          <a-radio-button value="en">English</a-radio-button>
+          <a-radio-button value="ja">日本語</a-radio-button>
+        </a-radio-group>
+      </div>
+
+      <div class="input-item">
+        <span class="input-label">{{ $t('general.theme') }}</span>
+        <a-radio-group v-model:value="uiTheme">
+          <a-radio-button value="system">{{ $t('general.system') }}</a-radio-button>
+          <a-radio-button value="light">{{ $t('general.light') }}</a-radio-button>
+          <a-radio-button value="dark">{{ $t('general.dark') }}</a-radio-button>
+        </a-radio-group>
+      </div>
+
+      <div class="input-item">
+        <span class="input-label">{{ $t('general.barWidth') }}</span>
+        <a-input
+          type="range" class="span-input"
+          min="6" max="12" v-model:value="leftBarWidth"
+        />
+        <div class="input-item-value">{{ (leftBarWidth * 100 / 24).toFixed(0) }}%</div>
+      </div>
+    </div>
+  </a-card>
+</template>
+
+<script setup lang="ts">
+import { storeToRefs } from 'pinia'
+import { useGeneralSettingStore } from '@renderer/stores/generalSetting'
+import { InfoCircleOutlined } from '@ant-design/icons-vue';
+
+const generalSettingStore = useGeneralSettingStore()
+const { uiLanguage, uiTheme, leftBarWidth } = storeToRefs(generalSettingStore)
+</script>
+
+<style scoped>
+@import url(../assets/input.css);
+
+.span-input {
+  width: 100px;
+}
+
+.general-note {
+  padding: 10px 10px 0;
+  max-width: min(36vw, 400px);
+}
+</style>
--- a/src/renderer/src/i18n/config/audio.ts
+++ b/src/renderer/src/i18n/config/audio.ts
@@ -0,0 +1,32 @@
+export const audioTypes = {
+  zh: [
+    {
+      value: 0,
+      label: '系统音频输出（扬声器）'
+    },
+    {
+      value: 1,
+      label: '系统音频输入（麦克风）'
+    }
+  ],
+  en: [
+    {
+      value: 0,
+      label: 'System Audio Output (Speaker)'
+    },
+    {
+      value: 1,
+      label: 'System Audio Input (Microphone)'
+    }
+  ],
+  ja: [
+    {
+      value: 0,
+      label: 'システム音声出力（スピーカー）'
+    },
+    {
+      value: 1,
+      label: 'システム音声入力（マイク）'
+    }
+  ]
+}
--- a/src/renderer/src/i18n/config/engine.ts
+++ b/src/renderer/src/i18n/config/engine.ts
@@ -0,0 +1,57 @@
+export const engines = {
+  zh: [
+    {
+      value: 'gummy',
+      label: '云端 - 阿里云 - Gummy',
+      languages: [
+        { value: 'auto', label: '自动检测' },
+        { value: 'en', label: '英语' },
+        { value: 'zh', label: '中文' },
+        { value: 'ja', label: '日语' },
+        { value: 'ko', label: '韩语' },
+        { value: 'de', label: '德语' },
+        { value: 'fr', label: '法语' },
+        { value: 'ru', label: '俄语' },
+        { value: 'es', label: '西班牙语' },
+        { value: 'it', label: '意大利语' },
+      ]
+    },
+  ],
+  en: [
+    {
+      value: 'gummy',
+      label: 'Cloud - Alibaba Cloud - Gummy',
+      languages: [
+        { value: 'auto', label: 'Auto Detect' },
+        { value: 'en', label: 'English' },
+        { value: 'zh', label: 'Chinese' },
+        { value: 'ja', label: 'Japanese' },
+        { value: 'ko', label: 'Korean' },
+        { value: 'de', label: 'German' },
+        { value: 'fr', label: 'French' },
+        { value: 'ru', label: 'Russian' },
+        { value: 'es', label: 'Spanish' },
+        { value: 'it', label: 'Italian' },
+      ]
+    },
+  ],
+  ja: [
+    {
+      value: 'gummy',
+      label: 'クラウド - アリババクラウド - Gummy',
+      languages: [
+        { value: 'auto', label: '自動検出' },
+        { value: 'en', label: '英語' },
+        { value: 'zh', label: '中国語' },
+        { value: 'ja', label: '日本語' },
+        { value: 'ko', label: '韓国語' },
+        { value: 'de', label: 'ドイツ語' },
+        { value: 'fr', label: 'フランス語' },
+        { value: 'ru', label: 'ロシア語' },
+        { value: 'es', label: 'スペイン語' },
+        { value: 'it', label: 'イタリア語' },
+      ]
+    },
+  ]
+}
+
--- a/src/renderer/src/i18n/config/linebreak.ts
+++ b/src/renderer/src/i18n/config/linebreak.ts
@@ -0,0 +1,32 @@
+export const breakOptions = {
+  zh: [
+    {
+      value: 1,
+      label: '换行（可能造成字幕窗口高度增加）'
+    },
+    {
+      value: 0,
+      label: '不换行（省略掉超出字幕窗口宽度的内容）'
+    }
+  ],
+  en: [
+    {
+      value: 1,
+      label: 'Wrap (may increase caption window height)'
+    },
+    {
+      value: 0,
+      label: 'Do not wrap (truncate content that exceeds caption window width)'
+    }
+  ],
+  ja: [
+    {
+      value: 1,
+      label: '改行する（字幕ウィンドウの高さが増える可能性があります）'
+    },
+    {
+      value: 0,
+      label: '改行しない（字幕ウィンドウの幅を超える内容は省略します）'
+    }
+  ]
+}
--- a/src/renderer/src/i18n/config/theme.ts
+++ b/src/renderer/src/i18n/config/theme.ts
@@ -0,0 +1,10 @@
+import { theme } from 'ant-design-vue';
+
+export const antDesignTheme = {
+  light: {
+    token: {}
+  },
+  dark: {
+    algorithm: theme.darkAlgorithm,
+  }
+}
--- a/src/renderer/src/i18n/index.ts
+++ b/src/renderer/src/i18n/index.ts
@@ -0,0 +1,20 @@
+import { createI18n } from 'vue-i18n';
+
+import zh from './lang/zh';
+import en from './lang/en';
+import ja from './lang/ja';
+
+export const i18n = createI18n({
+    legacy: false,
+    locale: 'zh',
+    messages: {
+        zh,
+        en,
+        ja
+    }
+});
+
+export * from './config/engine'
+export * from './config/audio'
+export * from './config/theme'
+export * from './config/linebreak'
--- a/src/renderer/src/i18n/lang/en.ts
+++ b/src/renderer/src/i18n/lang/en.ts
@@ -0,0 +1,125 @@
+export default {
+  lang: "en",
+  example: {
+    "original": "这是字幕样式预览。",
+    "translation": "(Translation) This is a preview of caption styles."
+  },
+  noti: {
+    "restarted": "Caption Engine Restarted Successfully",
+    "started": "Caption Engine Started Successfully",
+    "sLang": "Source language: ",
+    "trans": ", translation: ",
+    "engine": ", caption engine: ",
+    "audio": ", audio type: ",
+    "sysout": "system audio output (speaker)",
+    "sysin": "system audio input (microphone)",
+    "tLang": ", target language: ",
+    "custom": "Type: Custom engine, engine path: ",
+    "args": ", command arguments: ",
+    "pidInfo": ", caption engine process PID: ",
+    "stopped": "Caption Engine Stopped",
+    "stoppedInfo": "The caption engine has stopped. You can click the 'Start Caption Engine' button to restart it.",
+    "error": "An error occurred",
+    "engineChange": "Cpation Engine Configuration Changed",
+    "changeInfo": "If the caption engine is already running, you need to restart it for the changes to take effect.",
+    "styleChange": "Caption Style Changed",
+    "styleInfo": "Caption style changes have been saved and applied."
+  },
+  general: {
+    "title": "General Settings",
+    "uiLanguage": "Language",
+    "barWidth": "Width",
+    "note": "General Settings take effect immediately. Please note that changes to the Caption Engine Settings and Caption Style Settings will only take effect after clicking Apply.",
+    "theme": "Theme",
+    "light": "light",
+    "dark": "dark",
+    "system": "system"
+  },
+  engine: {
+    "title": "Caption Engine Settings",
+    "applyChange": "Apply Changes",
+    "cancelChange": "Cancel Changes",
+    "sourceLang": "Source",
+    "transLang": "Translation",
+    "captionEngine": "Engine",
+    "audioType": "Audio Type",
+    "systemOutput": "System Audio Output (Speaker)",
+    "systemInput": "System Audio Input (Microphone)",
+    "enableTranslation": "Translation",
+    "showMore": "More Settings",
+    "apikey": "API KEY",
+    "customEngine": "Custom Engine",
+    custom: {
+      "title": "Custom Caption Engine",
+      "attention": "Attention",
+      "note": "Note: Allows users to provide captions using a custom engine. The provided engine should be able to start via the command line and can specify parameters through command-line instructions. The engine needs to communicate with the node.js backend using standard output. For more information, refer to the project's documentation.",
+      "app": "Engine Path",
+      "command": "Command"
+    }
+  },
+  style: {
+    "title": "Caption Style Settings",
+    "applyStyle": "Apply",
+    "cancelChange": "Cancel",
+    "resetStyle": "Reset",
+    "longCaption": "LongCaption",
+    "fontFamily": "Font Family",
+    "fontColor": "Font Color",
+    "fontSize": "Font Size",
+    "fontWeight": "Font Weight",
+    "background": "Background",
+    "opacity": "Opacity",
+    "preview": "Preview",
+    "translation": "Show Translation",
+    trans: {
+      "title": "Translation Style Settings",
+      "useSame": "Use Original Style"
+    },
+    "textShadow": "Text Shadow",
+    shadow: {
+      "title": "Text Shadow Settings",
+      "offsetX": "Offset X",
+      "offsetY": "Offset Y",
+      "blur": "Blur",
+      "color": "Color"
+    }
+  },
+  status: {
+    "engine": "Caption Engine",
+    "customized": "Customized",
+    "status": "Engine Status",
+    "started": "Started",
+    "stopped": "Not Started",
+    "logNumber": "Caption Count",
+    "aboutProj": "About Project",
+    "openCaption": "Open Caption Window",
+    "startEngine": "Start Caption Engine",
+    "restartEngine": "Restart Caption Engine",
+    "stopEngine": "Stop Caption Engine",
+    about: {
+      "title": "About This Project",
+      "proj": "Auto Caption Project",
+      "desc": "A cross-platform real-time caption display software supporting multiple languages.",
+      "version": "Software Version",
+      "author": "Project Author",
+      "projLink": "Project Link",
+      "manual": "User Manual",
+      "engineDoc": "Caption Engine Manual",
+      "date": "July 9, 2026"
+    }
+  },
+  log: {
+    "title": "Caption Log",
+    "copy": "Copy to Clipboard",
+    "copyOptions": "Copy Options",
+    "addIndex": "Add Index",
+    "copyTime": "Copy Time",
+    "copyContent": "Content",
+    "both": "Original and Translation",
+    "source": "Original Only",
+    "translation": "Translation Only",
+    "copySuccess": "Subtitle copied to clipboard",
+    "export": "Export Caption Log",
+    "clear": "Clear Caption Log"
+  }
+}
--- a/src/renderer/src/i18n/lang/ja.ts
+++ b/src/renderer/src/i18n/lang/ja.ts
@@ -0,0 +1,125 @@
+export default {
+  lang: "ja",
+  example: {
+    "original": "这是字幕样式预览。",
+    "translation": "（翻訳）これは字幕のスタイルのプレビューです。"
+  },
+  noti: {
+    "restarted": "字幕エンジンが再起動しました",
+    "started": "字幕エンジンを開始しました",
+    "sLang": "ソース言語：",
+    "trans": "、翻訳する：",
+    "engine": "、字幕エンジン：",
+    "audio": "、オーディオタイプ：",
+    "sysout": "システムオーディオ出力（スピーカー）",
+    "sysin": "システムオーディオ入力（マイク）",
+    "tLang": "、翻訳先の言語：",
+    "custom": "タイプ：カスタムエンジン、エンジンパス：",
+    "args": "、コマンド引数：",
+    "pidInfo": "、字幕エンジンプロセス PID：",
+    "stopped": "字幕エンジンが停止しました",
+    "stoppedInfo": "字幕エンジンが停止しました。再起動するには「字幕エンジンを開始」ボタンをクリックしてください。",
+    "error": "エラーが発生しました",
+    "engineChange": "字幕エンジンの設定が変更されました",
+    "changeInfo": "字幕エンジンがすでに起動している場合、変更を有効にするには再起動が必要です。",
+    "styleChange": "字幕のスタイルが変更されました",
+    "styleInfo": "字幕のスタイル変更が保存され、適用されました"
+  },
+  general: {
+    "title": "一般設定",
+    "uiLanguage": "言語設定",
+    "barWidth": "左側の幅",
+    "note": "一般設定はすぐに有効になります。字幕エンジンの設定と字幕スタイルの設定を変更した場合は、適用ボタンをクリックしてから有効になりますのでご注意ください。",
+    "theme": "テーマ",
+    "light": "明るい",
+    "dark": "暗い",
+    "system": "システム"
+  },
+  engine: {
+    "title": "字幕エンジン設定",
+    "applyChange": "変更を適用",
+    "cancelChange": "変更をキャンセル",
+    "sourceLang": "ソース言語",
+    "transLang": "翻訳言語",
+    "captionEngine": "エンジン",
+    "audioType": "オーディオ",
+    "systemOutput": "システムオーディオ出力（スピーカー）",
+    "systemInput": "システムオーディオ入力（マイク）",
+    "enableTranslation": "翻訳",
+    "showMore": "詳細設定",
+    "apikey": "API KEY",
+    "customEngine": "カスタムエンジン",
+    custom: {
+      "title": "カスタムキャプションエンジン",
+      "attention": "注意事項",
+      "note": "注意：ユーザーがカスタムエンジンを使用して字幕を提供できるようにします。提供するエンジンは、コマンドラインから起動でき、パラメータをコマンドラインの指示で指定できる必要があります。エンジンは、標準出力を使用して node.js バックエンドと通信する必要があります。詳細については、プロジェクトドキュメントを参照してください。",
+      "app": "パス",
+      "command": "コマンド"
+    }
+  },
+  style: {
+    "title": "字幕スタイル設定",
+    "applyStyle": "適用",
+    "cancelChange": "キャンセル",
+    "resetStyle": "リセット",
+    "longCaption": "長い字幕",
+    "fontFamily": "フォント",
+    "fontColor": "カラー",
+    "fontSize": "サイズ",
+    "fontWeight": "文字の太さ",
+    "background": "背景色",
+    "opacity": "不透明度",
+    "preview": "プレビュー",
+    "translation": "翻訳表示",
+    trans: {
+      "title": "翻訳スタイル設定",
+      "useSame": "原文のスタイルを使用"
+    },
+    "textShadow": "文字影",
+    shadow: {
+      "title": "テキストの影設定",
+      "offsetX": "Offset X",
+      "offsetY": "Offset Y",
+      "blur": "ぼかし半径",
+      "color": "影の色"
+    }
+  },
+  status: {
+    "engine": "字幕エンジン",
+    "customized": "カスタマイズ済み",
+    "status": "エンジン状態",
+    "started": "開始済み",
+    "stopped": "未開始",
+    "logNumber": "字幕数",
+    "aboutProj": "プロジェクト情報",
+    "openCaption": "字幕ウィンドウを開く",
+    "startEngine": "字幕エンジンを開始",
+    "restartEngine": "字幕エンジンを再起動",
+    "stopEngine": "字幕エンジンを停止",
+    about: {
+      "title": "このプロジェクトについて",
+      "proj": "Auto Caption プロジェクト",
+      "desc": "複数の言語をサポートするクロスプラットフォームのリアルタイム字幕表示ソフトウェア。",
+      "version": "ソフトウェアバージョン",
+      "author": "プロジェクト作者",
+      "projLink": "プロジェクトリンク",
+      "manual": "ユーザーマニュアル",
+      "engineDoc": "字幕エンジンマニュアル",
+      "date": "2025 年 7 月 9 日"
+    }
+  },
+  log: {
+    "title": "字幕ログ",
+    "copy": "クリップボードにコピー",
+    "copyOptions": "コピー設定",
+    "addIndex": "順序番号",
+    "copyTime": "時間",
+    "copyContent": "内容",
+    "both": "原文と翻訳",
+    "source": "原文のみ",
+    "translation": "翻訳のみ",
+    "copySuccess": "字幕がクリップボードにコピーされました",
+    "export": "エクスポート",
+    "clear": "字幕ログをクリア"
+  }
+}
--- a/src/renderer/src/i18n/lang/zh.ts
+++ b/src/renderer/src/i18n/lang/zh.ts
@@ -0,0 +1,125 @@
+export default {
+  lang: "zh",
+  example: {
+    "original": "This is a preview of caption styles. ",
+    "translation": "（翻译）这是字幕样式预览。"
+  },
+  noti: {
+    "restarted": "字幕引擎重启成功",
+    "started": "字幕引擎启动成功",
+    "sLang": "源语言：",
+    "trans": "，是否翻译：",
+    "engine": "，字幕引擎：",
+    "audio": "，音频类型：",
+    "sysout": "系统音频输出（扬声器）",
+    "sysin": "系统音频输入（麦克风）",
+    "tLang": "，翻译语言：",
+    "custom": "类型：自定义引擎，引擎路径：",
+    "args": "，命令参数：",
+    "pidInfo": "，字幕引擎进程 PID：",
+    "stopped": "字幕引擎停止",
+    "stoppedInfo": "字幕引擎已经停止，可点击“启动字幕引擎”按钮重新启动",
+    "error": "发生错误",
+    "engineChange": "字幕引擎配置已更改",
+    "changeInfo": "如果字幕引擎已经启动，需要重启字幕引擎修改才会生效",
+    "styleChange": "字幕样式已修改",
+    "styleInfo": "字幕样式修改已经保存并生效"
+  },
+  general: {
+    "title": "通用设置",
+    "uiLanguage": "界面语言",
+    "barWidth": "左侧宽度",
+    "note": "通用设置修改后立即生效。注意字幕引擎设置和字幕样式的设置修改后需要点击应用后才会生效。",
+    "theme": "主题",
+    "light": "浅色",
+    "dark": "深色",
+    "system": "系统"
+  },
+  engine: {
+    "title": "字幕引擎设置",
+    "applyChange": "应用更改",
+    "cancelChange": "取消更改",
+    "sourceLang": "源语言",
+    "transLang": "翻译语言",
+    "captionEngine": "字幕引擎",
+    "audioType": "音频类型",
+    "systemOutput": "系统音频输出（扬声器）",
+    "systemInput": "系统音频输入（麦克风）",
+    "enableTranslation": "启用翻译",
+    "showMore": "更多设置",
+    "apikey": "API KEY",
+    "customEngine": "自定义引擎",
+    custom: {
+      "title": "自定义字幕引擎",
+      "attention": "注意事项",
+      "note": "说明：允许用户使用自定义引擎提供字幕。提供的引擎要能通过命令行启动，且可以提供命令行指令来指定参数。引擎需要使用标准输出与软件 node.js 后端进行通信。详细信息参考项目文档。",
+      "app": "引擎路径",
+      "command": "引擎指令"
+    }
+  },
+  style: {
+    "title": "字幕样式设置",
+    "applyStyle": "应用样式",
+    "cancelChange": "取消更改",
+    "resetStyle": "恢复默认",
+    "longCaption": "长字幕",
+    "fontFamily": "字体族",
+    "fontColor": "字体颜色",
+    "fontSize": "字体大小",
+    "fontWeight": "字体粗细",
+    "background": "背景颜色",
+    "opacity": "不透明度",
+    "preview": "显示预览",
+    "translation": "显示翻译",
+    trans: {
+      "title": "翻译样式设置",
+      "useSame": "使用原文样式"
+    },
+    "textShadow": "文本阴影",
+    shadow: {
+      "title": "文本阴影设置",
+      "offsetX": "X轴偏移",
+      "offsetY": "Y轴偏移",
+      "blur": "模糊半径",
+      "color": "阴影颜色"
+    }
+  },
+  status: {
+    "engine": "字幕引擎",
+    "customized": "自定义",
+    "status": "引擎状态",
+    "started": "已启动",
+    "stopped": "未启动",
+    "logNumber": "字幕数量",
+    "aboutProj": "项目关于",
+    "openCaption": "打开字幕窗口",
+    "startEngine": "启动字幕引擎",
+    "restartEngine": "重启字幕引擎",
+    "stopEngine": "关闭字幕引擎",
+    about: {
+      "title": "关于本项目",
+      "proj": "Auto Caption 项目",
+      "desc": "一个跨平台的支持多种语言的实时字幕显示软件。",
+      "version": "软件版本",
+      "author": "项目作者",
+      "projLink": "项目链接",
+      "manual": "用户手册",
+      "engineDoc": "字幕引擎手册",
+      "date": "2025 年 7 月 9 日"
+    }
+  },
+  log: {
+    "title": "字幕记录",
+    "export": "导出字幕记录",
+    "copy": "复制到剪贴板",
+    "copyOptions": "复制选项",
+    "addIndex": "添加序号",
+    "copyTime": "复制时间",
+    "copyContent": "复制内容",
+    "both": "原文与翻译",
+    "source": "仅原文",
+    "translation": "仅翻译",
+    "copySuccess": "字幕已复制到剪贴板",
+    "clear": "清空字幕记录"
+  }
+}
--- a/src/renderer/src/main.ts
+++ b/src/renderer/src/main.ts
@@ -1,14 +1,17 @@
-import './assets/reset.css'
-import { createPinia } from 'pinia'
+import './assets/main.css'
 import { createApp } from 'vue'
+import { createPinia } from 'pinia'

 import App from './App.vue'
 import router from './router'
+import { i18n } from './i18n'
 import Antd from 'ant-design-vue';
 import 'ant-design-vue/dist/reset.css';

 const app = createApp(App)
 app.use(createPinia())
 app.use(router)
+app.use(i18n)
 app.use(Antd)
-app.mount('#app')
+
+app.mount('#app')
--- a/src/renderer/src/stores/captionControl.ts
+++ b/src/renderer/src/stores/captionControl.ts
@@ -1,140 +0,0 @@
-import { ref } from 'vue'
-import { defineStore } from 'pinia'
-
-import { notification } from 'ant-design-vue'
-import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
-import { h } from 'vue'
-
-export const useCaptionControlStore = defineStore('captionControl', () => {
-  const captionEngine = ref([
-    {
-      value: 'gummy',
-      label: '云端-阿里云-Gummy',
-      languages: [
-        { value: 'auto', label: '自动检测' },
-        { value: 'en', label: '英语' },
-        { value: 'zh', label: '中文' },
-        { value: 'ja', label: '日语' },
-        { value: 'ko', label: '韩语' },
-        { value: 'de', label: '德语' },
-        { value: 'fr', label: '法语' },
-        { value: 'ru', label: '俄语' },
-        { value: 'es', label: '西班牙语' },
-        { value: 'it', label: '意大利语' },
-      ]
-    },
-  ])
-  const audioType = ref([
-    {
-      value: 0,
-      label: '系统音频输出（扬声器）'
-    },
-    {
-      value: 1,
-      label: '系统音频输入（麦克风）'
-    }
-  ])
-
-  const engineEnabled = ref(false)
-
-  const sourceLang = ref<string>('en')
-  const targetLang = ref<string>('zh')
-  const engine = ref<string>('gummy')
-  const audio = ref<0 | 1>(0)
-  const translation = ref<boolean>(true)
-  const customized = ref<boolean>(false)
-  const customizedApp = ref<string>('')
-  const customizedCommand = ref<string>('')
-
-  const changeSignal = ref<boolean>(false)
-
-  function sendControlChange() {
-    const controls = {
-      engineEnabled: engineEnabled.value,
-      sourceLang: sourceLang.value,
-      targetLang: targetLang.value,
-      engine: engine.value,
-      audio: audio.value,
-      translation: translation.value,
-      customized: customized.value,
-      customizedApp: customizedApp.value,
-      customizedCommand: customizedCommand.value
-    }
-    window.electron.ipcRenderer.send('control.control.change', controls)
-  }
-
-  function startEngine() {
-    window.electron.ipcRenderer.send('control.engine.start')
-  }
-
-  function stopEngine() {
-    window.electron.ipcRenderer.send('control.engine.stop')
-  }
-
-  window.electron.ipcRenderer.on('control.control.set', (_, controls) => {
-    sourceLang.value = controls.sourceLang
-    targetLang.value = controls.targetLang
-    engine.value = controls.engine
-    audio.value = controls.audio
-    engineEnabled.value = controls.engineEnabled
-    translation.value = controls.translation
-    customized.value = controls.customized
-    customizedApp.value = controls.customizedApp
-    customizedCommand.value = controls.customizedCommand
-    changeSignal.value = true
-  })
-
-  window.electron.ipcRenderer.on('control.engine.already', () => { 
-    notification.open({
-      message: '字幕引擎已经启动',
-      description: '字幕引擎已经启动，请勿重复启动'
-    });
-  })
-  
-  window.electron.ipcRenderer.on('control.engine.started', () => { 
-    const str0 = 
-      `原语言：${sourceLang.value}，是否翻译：${translation.value?'是':'否'}，` + 
-      `字幕引擎：${engine.value}，音频类型：${audio.value ? '输入音频' : '输出音频'}` +
-      (translation.value ? `，翻译语言：${targetLang.value}` : '');
-    const str1 = `类型：自定义引擎，引擎路径：${customizedApp.value}，命令参数：${customizedCommand.value}`;
-    notification.open({
-      message: '字幕引擎启动',
-      description: (customized.value && customizedApp.value) ? str1 : str0
-    });
-  })
-
-  window.electron.ipcRenderer.on('control.engine.stopped', () => { 
-    notification.open({
-      message: '字幕引擎停止',
-      description: '可点击“启动字幕引擎”按钮重新启动'
-    });
-  })
-
-  window.electron.ipcRenderer.on('control.error.send', (_, message) => { 
-    notification.open({
-      message: '发生错误',
-      description: message,
-      duration: null,
-      placement: 'topLeft',
-      icon: () => h(ExclamationCircleOutlined, { style: 'color: #ff4d4f' })
-    });
-  })
-
-  return {
-    captionEngine,      // 字幕引擎
-    audioType,          // 音频类型
-    engineEnabled,      // 字幕引擎是否启用
-    sourceLang,         // 源语言
-    targetLang,         // 目标语言
-    engine,             // 字幕引擎
-    audio,              // 选择音频
-    translation,        // 是否启用翻译
-    customized,         // 是否使用自定义字幕引擎
-    customizedApp,      // 自定义字幕引擎的应用程序
-    customizedCommand,  // 自定义字幕引擎的命令
-    sendControlChange,  // 发送最新控制消息到后端
-    startEngine,        // 启动字幕引擎
-    stopEngine,         // 停止字幕引擎
-    changeSignal,       // 配置改变信号
-  }
-})
--- a/src/renderer/src/stores/captionLog.ts
+++ b/src/renderer/src/stores/captionLog.ts
@@ -1,32 +1,24 @@
 import { ref } from 'vue'
 import { defineStore } from 'pinia'
-
-interface CaptionItem {
-  index: number,
-  time_s: string,
-  time_t: string,
-  text: string,
-  translation: string
-}
+import { CaptionItem } from '../types'

 export const useCaptionLogStore = defineStore('captionLog', () => {
  const captionData = ref<CaptionItem[]>([])

-  window.electron.ipcRenderer.on('both.log.add', (_, log) => {
-    if(captionData.value.length && log.index === captionData.value[captionData.value.length - 1].index) {
-      captionData.value.splice(captionData.value.length - 1, 1, log)
-    }
-    else {
-      captionData.value.push(log)
-    }
-  })
-
  function clear() {
    captionData.value = []
-    window.electron.ipcRenderer.send('control.caption.clear')
+    window.electron.ipcRenderer.send('control.captionLog.clear')
  }

-  window.electron.ipcRenderer.on('both.log.set', (_, logs) => {
+  window.electron.ipcRenderer.on('both.captionLog.add', (_, log) => {
+    captionData.value.push(log)
+  })
+
+  window.electron.ipcRenderer.on('both.captionLog.upd', (_, log) => {
+    captionData.value.splice(captionData.value.length - 1, 1, log)
+  })
+
+  window.electron.ipcRenderer.on('both.captionLog.set', (_, logs) => {
    captionData.value = logs
  })

@@ -34,4 +26,4 @@ export const useCaptionLogStore = defineStore('captionLog', () => {
    captionData,
    clear
  }
-})
+})
--- a/src/renderer/src/stores/captionStyle.ts
+++ b/src/renderer/src/stores/captionStyle.ts
@@ -1,18 +1,29 @@
 import { ref, computed } from 'vue'
 import { defineStore } from 'pinia'
+import { Styles } from '@renderer/types'
+import { breakOptions } from '@renderer/i18n'

 export const useCaptionStyleStore = defineStore('captionStyle', () => {
+  const lineBreak = ref<number>(1)
  const fontFamily = ref<string>('sans-serif')
  const fontSize = ref<number>(24)
  const fontColor = ref<string>('#000000')
+  const fontWeight = ref<number>(4)
  const background = ref<string>('#dbe2ef')
  const opacity = ref<number>(80)
-  
+  const showPreview = ref<boolean>(true)
  const transDisplay = ref<boolean>(true)
  const transFontFamily = ref<string>('sans-serif')
  const transFontSize = ref<number>(24)
  const transFontColor = ref<string>('#000000')
+  const transFontWeight = ref<number>(4)
+  const textShadow = ref<boolean>(false)
+  const offsetX = ref<number>(2)
+  const offsetY = ref<number>(2)
+  const blur = ref<number>(0)
+  const textShadowColor = ref<string>('#ffffff')

+  const iBreakOptions = ref(breakOptions['zh'])
  const changeSignal = ref<boolean>(false)

  function addOpicityToColor(color: string, opicity: number) {
@@ -25,51 +36,84 @@ export const useCaptionStyleStore = defineStore('captionStyle', () => {
    return addOpicityToColor(background.value, opacity.value)
  })

-  function sendStyleChange() {
-    const styles = {
+  function sendStylesChange() {
+    const styles: Styles = {
+      lineBreak: lineBreak.value,
      fontFamily: fontFamily.value,
      fontSize: fontSize.value,
      fontColor: fontColor.value,
+      fontWeight: fontWeight.value,
      background: background.value,
      opacity: opacity.value,
+      showPreview: showPreview.value,
      transDisplay: transDisplay.value,
      transFontFamily: transFontFamily.value,
      transFontSize: transFontSize.value,
-      transFontColor: transFontColor.value
+      transFontColor: transFontColor.value,
+      transFontWeight: transFontWeight.value,
+      textShadow: textShadow.value,
+      offsetX: offsetX.value,
+      offsetY: offsetY.value,
+      blur: blur.value,
+      textShadowColor: textShadowColor.value
    }
-    window.electron.ipcRenderer.send('control.style.change', styles)
+    window.electron.ipcRenderer.send('control.styles.change', styles)
  }

-  function sendStyleReset() {
-    window.electron.ipcRenderer.send('control.style.reset')
+  function sendStylesReset() {
+    window.electron.ipcRenderer.send('control.styles.reset')
  }

-  window.electron.ipcRenderer.on('caption.style.set', (_, args) => {
+  function setStyles(args: Styles){
+    lineBreak.value = args.lineBreak
    fontFamily.value = args.fontFamily
    fontSize.value = args.fontSize
    fontColor.value = args.fontColor
+    fontWeight.value = args.fontWeight
    background.value = args.background
    opacity.value = args.opacity
+    showPreview.value = args.showPreview
    transDisplay.value = args.transDisplay
    transFontFamily.value = args.transFontFamily
    transFontSize.value = args.transFontSize
-    transFontColor.value = args.transFontColor
+    transFontColor.value = args.transFontColor,
+    transFontWeight.value = args.transFontWeight
+    textShadow.value = args.textShadow
+    offsetX.value = args.offsetX
+    offsetY.value = args.offsetY
+    blur.value = args.blur
+    textShadowColor.value = args.textShadowColor
    changeSignal.value = true
+  }
+
+  window.electron.ipcRenderer.on('both.styles.set', (_, args: Styles) => {
+    setStyles(args)
  })

  return {
+    lineBreak,          // 换行方式
    fontFamily,         // 字体族
    fontSize,           // 字体大小
    fontColor,          // 字体颜色
+    fontWeight,         // 字体粗细
    background,         // 背景颜色
    opacity,            // 背景透明度
+    showPreview,        // 是否显示预览
    transDisplay,       // 是否显示翻译
    transFontFamily,    // 翻译字体族
    transFontSize,      // 翻译字体大小
    transFontColor,     // 翻译字体颜色
+    transFontWeight,    // 翻译字体粗细
+    textShadow,         // 是否显示文本阴影
+    offsetX,            // 阴影X轴偏移
+    offsetY,            // 阴影Y轴偏移
+    blur,               // 阴影模糊度半径
+    textShadowColor,    // 阴影颜色
    backgroundRGBA,     // 带透明度的背景颜色
-    sendStyleChange,    // 发送样式改变
-    sendStyleReset,   // 恢复默认样式
+    setStyles,          // 设置样式
+    sendStylesChange,   // 发送样式改变
+    sendStylesReset,    // 恢复默认样式
+    iBreakOptions,      // 换行选项
    changeSignal        // 样式改变信号
  }
-})
+})
--- a/src/renderer/src/stores/engineControl.ts
+++ b/src/renderer/src/stores/engineControl.ts
@@ -0,0 +1,121 @@
+import { ref, watch } from 'vue'
+import { defineStore } from 'pinia'
+
+import { notification } from 'ant-design-vue'
+import { ExclamationCircleOutlined } from '@ant-design/icons-vue'
+import { h } from 'vue'
+import { useI18n } from 'vue-i18n'
+
+import { Controls } from '@renderer/types'
+import { engines, audioTypes } from '@renderer/i18n'
+import { useGeneralSettingStore } from './generalSetting'
+
+export const useEngineControlStore = defineStore('engineControl', () => {
+  const { t } = useI18n()
+  const platform = ref('unknown')
+
+  const captionEngine = ref(engines[useGeneralSettingStore().uiLanguage])
+  const audioType = ref(audioTypes[useGeneralSettingStore().uiLanguage])
+  const API_KEY = ref<string>('')
+  const engineEnabled = ref(false)
+  const sourceLang = ref<string>('en')
+  const targetLang = ref<string>('zh')
+  const engine = ref<'gummy'>('gummy')
+  const audio = ref<0 | 1>(0)
+  const translation = ref<boolean>(true)
+  const customized = ref<boolean>(false)
+  const customizedApp = ref<string>('')
+  const customizedCommand = ref<string>('')
+
+  const changeSignal = ref<boolean>(false)
+
+  function sendControlsChange() {
+    const controls: Controls = {
+      engineEnabled: engineEnabled.value,
+      sourceLang: sourceLang.value,
+      targetLang: targetLang.value,
+      engine: engine.value,
+      audio: audio.value,
+      translation: translation.value,
+      API_KEY: API_KEY.value,
+      customized: customized.value,
+      customizedApp: customizedApp.value,
+      customizedCommand: customizedCommand.value
+    }
+    window.electron.ipcRenderer.send('control.controls.change', controls)
+  }
+
+  function setControls(controls: Controls) {
+    sourceLang.value = controls.sourceLang
+    targetLang.value = controls.targetLang
+    engine.value = controls.engine
+    audio.value = controls.audio
+    engineEnabled.value = controls.engineEnabled
+    translation.value = controls.translation
+    API_KEY.value = controls.API_KEY
+    customized.value = controls.customized
+    customizedApp.value = controls.customizedApp
+    customizedCommand.value = controls.customizedCommand
+    changeSignal.value = true
+  }
+
+  window.electron.ipcRenderer.on('control.controls.set', (_, controls: Controls) => {
+    setControls(controls)
+  })
+
+  window.electron.ipcRenderer.on('control.engine.started', (_, args) => {
+    const str0 =
+      `${t('noti.sLang')}${sourceLang.value}${t('noti.trans')}${translation.value?'yes':'no'}` +
+      `${t('noti.engine')}${engine.value}${t('noti.audio')}${audio.value?t('noti.sysin'):t('noti.sysout')}` +
+      (translation.value ? `${t('noti.tLang')}${targetLang.value}` : '');
+    const str1 = `${t('noti.custom')}${customizedApp.value}${t('noti.args')}${customizedCommand.value}`;
+    notification.open({
+      message: t('noti.started'),
+      description:
+        ((customized.value && customizedApp.value) ? str1 : str0) +
+        `${t('noti.pidInfo')}${args}`
+    });
+  })
+
+  window.electron.ipcRenderer.on('control.engine.stopped', () => {
+    notification.open({
+      message: t('noti.stopped'),
+      description: t('noti.stoppedInfo')
+    });
+  })
+
+  window.electron.ipcRenderer.on('control.error.occurred', (_, message) => {
+    notification.open({
+      message: t('noti.error'),
+      description: message,
+      duration: null,
+      placement: 'topLeft',
+      icon: () => h(ExclamationCircleOutlined, { style: 'color: #ff4d4f' })
+    });
+  })
+
+  watch(platform, (newValue) => {
+    if(newValue !== 'win32' && newValue !== 'darwin') {
+      audio.value = 1
+    }
+  })
+
+  return {
+    platform,           // 系统平台
+    captionEngine,      // 字幕引擎
+    audioType,          // 音频类型
+    engineEnabled,      // 字幕引擎是否启用
+    sourceLang,         // 源语言
+    targetLang,         // 目标语言
+    engine,             // 字幕引擎
+    audio,              // 选择音频
+    translation,        // 是否启用翻译
+    API_KEY,            // API KEY
+    customized,         // 是否使用自定义字幕引擎
+    customizedApp,      // 自定义字幕引擎的应用程序
+    customizedCommand,  // 自定义字幕引擎的命令
+    setControls,        // 设置引擎配置
+    sendControlsChange, // 发送最新控制消息到后端
+    changeSignal,       // 配置改变信号
+  }
+})
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
himeditator	606f9b480b	release v0.3.0 - 新增字幕字体粗细、文本阴影等设置选项 - 更新相关文档，增加新功能说明 - 修复系统主题载入颜色bug	2025-07-09 01:33:21 +08:00
Chen Janai	546beb3112	Merge pull request #6 from HiMeditator/mac-adaption Mac Adaption	2025-07-08 22:46:51 +08:00
himeditator mac	3c9138f115	feat(docs): 更新文档、添加 macOS 平台适配指南	2025-07-08 22:44:11 +08:00
himeditator mac	cbbaaa95a3	feat(gummy): 支持通过设置添加 API KEY - 更新 main-gummy.py 以支持 API KEY 参数 - 修改 electron-builder.yml 以调整 Gummy 可执行文件路径	2025-07-08 21:05:43 +08:00
himeditator mac	7e953db6bd	feat(sysaudio): 支持 macOS 系统音频流采集 - 新增 darwin.py 文件实现 macOS 音频流采集功能 - 修改 main-gummy.py 以支持 macOS 平台 - 更新 AllConfig 和 CaptionEngine 以适配新平台	2025-07-08 17:04:15 +08:00
himeditator mac	65da30f83d	build: 进行 macOS 适配，更新图标资源并升级项目版本 - 移除旧的图标资源，更新为新的图标 - 更新项目版本号至 0.2.1 - 修改 README 中的环境搭建说明，增加 macOS 支持	2025-07-08 13:27:44 +08:00
himeditator	1965bbfee7	feat(docs): 修复仅复制原文时的bug，更新 TODO.md	2025-07-08 01:44:38 +08:00
himeditator	8ac1c99c63	feat(log): 添加字幕记录复制功能 (#3 ) - 提高记录时间精度，精确到毫秒 - 在字幕记录组件中添加复制到剪贴板的功能 - 提供多种复制选项，包括是否添加序号、是否复制时间、选择复制内容等	2025-07-08 01:33:48 +08:00
himeditator	082eb8579b	docs(README): 更新自带字幕引擎说明 (#4 ) - 在 README.md、README_en.md 和 README_ja.md 中添加了自带字幕引擎的详细说明 - 给予字幕窗口更大的顶置优先级	2025-07-07 22:54:30 +08:00
himeditator	0696651f04	feat(audio): 重构音频处理模块、音频流重采样测试成功	2025-07-07 22:54:30 +08:00
himeditator	f2aa075e65	refactor(caption-engine): 重构字幕引擎代码结构 - 重构 GummyTranslator 类，增加启动和停止方法 - 优化 AudioStream 类，添加读取音频数据方法 - 更新 main-gummy.py，使用新的 GummyTranslator 和 AudioStream 接口 - 更新文档和 TODO 列表	2025-07-07 22:54:30 +08:00
himeditator	213426dace	release v0.2.0 - 更新和增加文档 - 添加新的图片 - 优化文档结构和内容	2025-07-07 22:54:30 +08:00
himeditator	50ea9c5e4c	refactor(caption): 重构字幕引擎结构、修复字幕引擎空置报错 (#2 ) - 修复gummy字幕引擎长时间空置报错的问题 - 将 python-subprocess 文件夹重命名为 caption-engine - 删除未使用的 prototype 代码	2025-07-07 22:53:35 +08:00
himeditator	22cfb75d2c	feat(renderer): 增加长字幕隐藏功能 (#1 ) - 修复暗色主题部分内容的显示颜色 - 添加长字幕内容隐藏功能 - 优化字幕样式预览界面，支持动态显示最新字幕内容	2025-07-07 22:52:49 +08:00
himeditator	f29e15cde5	feat(theme): 添加暗色主题支持 - 新增暗色主题选项和系统主题自动适配功能 - 调整了部分样式以适应暗色主题	2025-07-05 00:54:12 +08:00
himeditator	14e7a7bce4	feat: 完全实现多语言支持、优化软件体验 - 完成多语言的剩余内容的翻译 - 重构配置管理，前端页面实现更快速的配置载入 - 为字幕引擎添加更严格的状态限制，防止出现僵尸进程	2025-07-04 22:27:43 +08:00
himeditator	0b279dedbf	docs(api): 修改部分通信接口、更新 API 文档 - 重新定义了通信命令的命名规则和语义 - 修改了多个前端和后端之间的通信接口 - 为模型信息添加国际化	2025-07-04 18:38:56 +08:00
himeditator	0a10068b38	feat(i18n): 实现前端国际化 - 新增英文、日文和中文翻译文件 - 添加语言切换功能 - 更新各组件的文本内容以支持国际化	2025-07-03 23:29:10 +08:00
himeditator	d608bf59c7	feat(i18n): 后端添加国际化支持、优化前端界面 - 后端添加并实现国际化支持 - 前端引入 vue-i18n 模块（尚未添加国际化逻辑） - 优化用户界面样式，统一输入框和标签样式	2025-07-03 20:36:09 +08:00
himeditator	3dcba07b6e	refactor(renderer): 重构项目前端 - 拆分了 CaptionData 和 ControlPage 组件 - 对部分页面和变量进行了重命名 - 重构优化了状态管理，新增状态管理	2025-07-02 20:56:21 +08:00
himeditator	e77779b72a	refactor: 重构项目后端 - 移除 .npmrc 中的镜像配置 - 移除 package.json 中未使用的依赖 - 大幅重构后端代码	2025-07-01 21:50:33 +08:00
				`@@ -0,0 +1 @@`
				<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="6 6 52 52"><defs><style>.cls-1{fill:#a8d2f0;}.cls-2{fill:#389ad6;}.cls-3,.cls-4{fill:none;}.cls-4{stroke:#295183;stroke-linecap:round;stroke-linejoin:round;stroke-width:2px;}.cls-5{fill:#295183;}</style></defs><title>weather, forecast, direction, compass</title><path class="cls-1" d="M25.56,17.37c-.87,6.45-1.73,22.73,10.26,29.37A1.77,1.77,0,0,1,35.15,50C27.56,51,15,50,13.05,33.13a1.9,1.9,0,0,1,0-.21c0-1.24.11-13.46,10.07-17.41A1.77,1.77,0,0,1,25.56,17.37Z"/><path class="cls-2" d="M30.32,35l1,4.45a3.2,3.2,0,0,0-.22.72c-.1.46-.19.92-.29,1.38-.13.68-.39,1.49-1.06,1.67s-1.32-.44-1.55-1.11S28,40.72,27.84,40s-.76-1.33-1.45-1.26c-.34,0-.62.27-1,.32-.78.16-.31-1.79-.46-2.13a1.67,1.67,0,0,0-1.08-.82c-.91-.27-3.85-.37-3.06-2.07a1.68,1.68,0,0,1,1.07-.76,9.87,9.87,0,0,1,1.4-.32,3.94,3.94,0,0,0,1.26-.32l4.44,1,1.07.23Z"/><path class="cls-2" d="M30.32,28.31l-.24,1.07L29,29.62,27.26,30a1.83,1.83,0,0,0,.52-.8A6,6,0,0,0,28,28c0-.26.07-.5.12-.74a1.26,1.26,0,0,1,.1-.29Z"/><path class="cls-2" d="M34.62,29.37l0-.2.69-.43a2.66,2.66,0,0,1-.38.7Z"/><line class="cls-3" x1="33.74" y1="37.87" x2="33.45" y2="39.16"/><path class="cls-2" d="M37,35.79A4.71,4.71,0,0,1,36,36a7.51,7.51,0,0,0-1,.17,2.43,2.43,0,0,0-.37.13,2,2,0,0,0-.62.47l.4-1.78.23-1.07,1.07-.23Z"/><polyline class="cls-4" points="32 20.86 30.47 27.68 30.17 28.99 29.95 29.95 28.99 30.17 27.42 30.52 26.41 30.75 25.24 31.01 20.86 32 25 32.93 28.99 33.83 29.95 34.04 30.17 35.01 31.07 39.01 32 43.14 32.99 38.75 33.25 37.59 33.47 36.6 33.83 35 34.04 34.04 35 33.83 36.27 33.54 43.14 32 35.01 30.17 34.28 30.01 34.04 29.95 34 29.77 33.83 28.99 33.38 26.98"/><polygon class="cls-4" points="30.17 28.99 29.95 29.95 28.99 30.17 28.09 28.74 26.98 26.98 28.29 27.81 30.17 28.99"/><polygon class="cls-4" points="30.17 35.01 26.98 37.02 28.99 33.83 29.95 34.04 30.17 35.01"/><polygon class="cls-4" points="37.02 37.02 35.26 35.91 33.83 35 34.04 34.04 35 33.83 36.2 35.72 37.02 37.02"/><polygon class="cls-4" points="37.02 26.98 35.01 30.17 34.28 30.01 34.04 29.95 34 29.77 33.83 28.99 37.02 26.98"/><path class="cls-4" d="M38.42,14.13A19.08,19.08,0,1,1,32,13a19.19,19.19,0,0,1,2,.11"/><circle class="cls-5" cx="32.03" cy="16.99" r="1"/><circle class="cls-5" cx="47.01" cy="32.03" r="1"/><circle class="cls-5" cx="31.97" cy="47.01" r="1"/><circle class="cls-5" cx="16.99" cy="31.97" r="1"/></svg>
				`@@ -0,0 +1 @@`
				`from .process import mergeChunkChannels, resampleRawChunk`