diff --git a/README.md b/README.md index ebb0165..c82431e 100644 --- a/README.md +++ b/README.md @@ -1,89 +1,135 @@ -# md_reader +# MD Reader -A simple Markdown reader with Mermaid diagram support. +Markdown 文件閱讀器,支援 Mermaid 圖表、PDF 匯出,原生視窗預覽。 -## Features - -- Render Markdown to HTML -- Batch convert Markdown files -- HTTP server for serving files -- **Mermaid diagram support** with SVG export -- Preview in browser -- Export to PDF via browser print - -## Installation +## 安裝 ```bash cargo build --release ``` -## Usage +## 功能 -### Render a single file +### 1. Markdown 轉 HTML ```bash -md_reader render document.md -o output.html +./target/release/md_reader render docs/example.md +# 輸出到 ~/docs/html/example.html ``` -### Batch convert +### 2. 原生視窗預覽 ```bash -md_reader batch ./docs/ -o ./html/ +./target/release/md_reader preview docs/example.md ``` -### Start HTTP server +### 3. 批次轉換 ```bash -md_reader server -p 8080 -d ./docs/ +./target/release/md_reader batch ./docs ``` -### Preview in browser +### 4. PDF 匯出 ```bash -md_reader preview document.md +./target/release/md_reader export docs/example.md -o output.pdf +# 或使用 render -p +./target/release/md_reader render docs/example.md -p ``` -### Export to PDF +### 5. HTTP 伺服器 ```bash -# Method 1: Using export command -md_reader export document.md -o output.html - -# Method 2: Using render with -p flag -md_reader render document.md -p +./target/release/md_reader server --port 8080 --path ./docs ``` -Open the exported HTML file in browser, then use **File > Print > Save as PDF**. +## 視窗功能 -## Mermaid Support +### 工具列按鈕 -md_reader supports rendering Mermaid diagrams in Markdown files. +| 按鈕 | 功能 | +|------|------| +| Print / Save as PDF | 列印或儲存為 PDF | +| Download All SVGs | 下載所有 Mermaid 圖表為 SVG | +| Pan | 滑鼠拖曳平移內容 | +| − / + | 縮小 / 放大 | +| Reset | 重置縮放為 100% | -### Usage +### 終端機命令 -Use `mermaid` code blocks: +按 `/` 開啟終端輸入框。 -```markdown +| 命令 | 功能 | +|------|------| +| `/help` | 顯示幫助訊息 | +| `/clear` | 清除終端輸出 | +| `/print` | 開啟列印對話框 | +| `/svg` | 下載所有 SVG 圖表 | +| `/reload` | 重新載入頁面 | +| `/zoom [N]` | 設定縮放 (50-200%) | +| `/zoom in` 或 `/zoom +` | 放大 10% | +| `/zoom out` 或 `/zoom -` | 縮小 10% | +| `/zoom reset` 或 `/zoom 0` | 重置為 100% | + +### Shell 命令 + +直接輸入 shell 命令(不帶 `/`)執行: + +```bash +ls # 列出檔案 +pwd # 顯示目前目錄 +cd # 切換目錄 +cat # 顯示檔案內容 +``` + +### Pan 模式 + +1. 點擊工具列的 `Pan` 按鈕 +2. 按住滑鼠左鍵拖曳移動內容 +3. 再次點擊 `Pan` 按鈕關閉 + +### 快捷鍵 + +| 按鍵 | 功能 | +|------|------| +| `/` | 開啟終端輸入框 | +| `Esc` | 關閉終端輸入框 | + +## Mermaid 圖表支援 + +在 Markdown 中使用 ```mermaid 程式碼塊: + +````markdown ```mermaid graph TD A[Start] --> B[End] ``` +```` + +支援的圖表類型: +- Flowchart (流程圖) +- Sequence Diagram (序列圖) +- Class Diagram (類別圖) +- State Diagram (狀態圖) +- Entity Relationship Diagram (ER 圖) +- Gantt Chart (甘特圖) +- Pie Chart (圓餅圖) + +## 專案結構 + +``` +md_reader/ +├── Cargo.toml +├── src/ +│ └── main.rs # 主要程式碼 +└── docs/ + └── mermaid.md # Mermaid 範例文件 ``` -### Supported Diagram Types +## 依賴 -- Flowchart -- Sequence Diagram -- Class Diagram -- State Diagram -- Gantt Chart -- Pie Chart -- Entity Relationship Diagram - -### SVG Export - -Hover over any Mermaid diagram and click "Download SVG" to download the vector graphic. - -## License - -MIT +- Rust 2021 edition +- tao (視窗管理) +- wry (WebView) +- pulldown-cmark (Markdown 解析) +- clap (命令列參數)