╔═══════════════════════════════════════════════════════════════╗
║                                                               ║
║    🎥   S C R E E N R E C O R D E R   P R O                  ║
║           全 端 螢 幕 錄 影 工 具 P r o (長 時 強 化 版)          ║
║                                                               ║
║    ▸ 本機擷取 ‧ 雙軌混音 ‧ 子母攝影機 ‧ 磁碟快取 ‧ 空間守護    ║
║                                                               ║
╚═══════════════════════════════════════════════════════════════╝

螢幕錄影工具 Pro (Screenrecorder - 超長時錄影防崩潰強化版)

本工具為免安裝的純前端網頁應用程式，直接在瀏覽器中進行高畫質的螢幕錄影與混合錄音。採用最新 IndexedDB 磁碟快取串流、硬碟空間自動偵測與守護 與 純螢幕 Zero-Copy 直通架構，徹底解決傳統網頁錄影「長時間錄製導致記憶體耗盡 (OOM) 閃退」、「硬碟空間不足導致檔案損毀」、「切換視窗背景節流畫面凍結」以及「WebM 影片無法拖動進度條」等核心缺陷。

---

🗺️ 功能架構地圖 (Functional Map)

線上螢幕錄影工具 Pro (Screenrecorder)
├── 1. 畫面擷取來源核心 (Display Render Engine)
│   ├── 純螢幕硬體直通 (Zero-Copy Pass-Through，免 Canvas 負擔，完全免疫背景分頁節流)
│   ├── 支援擷取範圍：全螢幕桌面 / 特定應用程式視窗 / 單一瀏覽器分頁
│   └── 多檔位碼率：標準高畫質 (5Mbps) / 長時節能 (2.5Mbps) / 極致原畫 (8Mbps)
├── 2. 雙軌錄音混音引擎 (Audio Mixing)
│   ├── 單音源直通模式 (純系統聲或純麥克風，零延遲免 WebAudio 負擔)
│   └── 雙音源 WebAudio 混音 (系統聲 + 麥克風，具備背景防休眠保活機制)
├── 3. 特效與合成渲染面 (Canvas Compositing)
│   └── 子母畫面網路攝影機 (PiP Webcam，支援即時拖曳定位)
│       └── 雙驅動保全渲染 (前景 rAF + 背景定時保全，切換視窗絕不凍結)
├── 4. 中控與進度系統 (Control Panel)
│   ├── 錄音狀態機 (等待設定 / 錄影中 / 暫停 / 打包中 / 錄製完成)
│   ├── 大字元精確計時器 (支援 HH:MM:SS 長時格式)
│   └── 即時監控數據 (即時累計檔案大小 KB / MB / GB 顯示)
├── 5. 硬碟空間智慧偵測與自動防護 (Disk Space Guardian)
│   ├── 錄前配額預檢 (自動換算剩餘 GB 與預估可錄製時長)
│   ├── 碼率切換動態估算 (即時重算可錄小時數)
│   └── 錄中安全守護 (每 10 秒即時輪詢，空間危急 <150MB 自動停止並安全存檔)
└── 6. 長時存儲與匯出修復系統 (Export & Storage Engine)
    ├── IndexedDB 磁碟沙盒串流 (區塊即時寫入磁碟，記憶體 RAM 恆定不膨脹)
    ├── 斷線與崩潰還原 (Crash Recovery：意外重整頁面可一鍵救回錄影)
    ├── WebM EBML Duration 時間軸修復 (注入精確持續時間，支援全播放器 Seeking 拖曳)
    └── 瀏覽器原生影片回放預覽與一鍵下載

---

🌟 核心特色

1. 100% 本地端運行 (Local Only)：純前端實作，不依賴任何後端伺服器，您的錄影檔案與畫面絕對不會外流，確保最高等級的隱私安全。
2. 硬碟空間自動偵測與守護 (Disk Space Guardian)：
   • 啟動前自動呼叫 Storage Estimate API 估算可用剩餘磁碟空間與預估可錄製時長。
   • 錄影期間每 10 秒即時輪詢，若剩餘空間降至極限（< 150MB），系統會自動安全結束並保存已錄製內容，防止硬碟爆滿造成影片損壞。
3. 突破網頁記憶體極限 (IndexedDB 磁碟快取)：錄影區塊每秒直接寫入瀏覽器沙盒磁碟，記憶體佔用恆定維持在數十 MB，支援數小時甚至更長的長時間會議與教學錄製，告別記憶體崩潰（Aw, Snap! / Out of Memory）。
4. 背景切換不凍結 (Zero-Copy & Background Guard)：
   • 純螢幕模式下直接採用硬體直通串流，切換到其他軟體或最小化時完全不受瀏覽器 requestAnimationFrame 節流影響。
   • 子母畫面模式下內建背景定時保全計時器，確保畫布持續合成不卡死。
5. 完整進度條支援 (WebM EBML Duration Patch)：內建純前端 EBML 時間軸標頭修復，導出的影片在 Chrome、Edge、VLC、QuickTime 等播放器皆可正常顯示總時間與隨意快進倒退。
6. 意外崩潰還原 (Crash Recovery)：即使錄影中途不慎關閉分頁或瀏覽器異常重啟，重新開啟網頁時會自動提示「發現未完成紀錄」，可一鍵還原下載。

---

🛠 詳細功能與介紹

1. 多元畫面擷取模式 (Display Surface Mode)

• 整個螢幕桌面：錄製整個電腦畫面（推薦，視野最完整）。
• 特定應用程式視窗：僅錄製某個被打開的軟體畫面（例如 PowerPoint 簡報），保護其他視窗隱私。
• 特定瀏覽器分頁：僅錄製當前瀏覽器中的某個指定分頁。

2. 畫質與碼率模式選擇

• 標準高畫質 (5 Mbps)：兼具清晰度與流暢度，適合一般教學與操作示範。
• 長時節能省空間 (2.5 Mbps)：適合數小時的線上會議、演講、長時間監控錄影，檔案體積極致輕量。
• 極致原畫細節 (8 Mbps)：適合遊戲動態、高精細設計展示。

3. 硬碟剩餘空間與時長換算

• 即時顯示本機硬碟可用 GB 與可錄製總時長。
• 切換不同畫質模式時自動連動換算。
• 提供綠色（充足）、黃色（偏低）、紅色（危急）狀態標籤與進度條指示。

4. 專業級雙軌混音

• 錄製系統聲音：能夠側錄電腦本身發出的聲音（如背景音樂、會議中的其他人的聲音）。
• 錄製麥克風：錄下旁白解說，內建迴音消除與雜音抑制。
• 若僅勾選單一音訊源，系統自動啟用直通模式以節省資源；同時勾選時自動啟動 Web Audio 混音並具備背景保活。

5. 可拖曳子母畫面攝影機 (PiP Camera)

• 開啟網路攝影機（Webcam）後，即時人像以「子母畫面」浮動於預覽區。
• 支援滑鼠 / 觸控自由拖曳，可隨意移至不遮擋簡報重點的位置。

---

⚠️ 使用須知 (Usage Notices)

1. Mac 系統聲音錄製說明：由於 macOS 系統隱私權限制，瀏覽器擷取「整個螢幕」時預設無法直接錄取全域系統音訊（僅分頁支援音訊共用）。若需在 Mac 錄製全系統聲音，可搭配如 BlackHole 等虛擬音訊驅動程式。
2. 瀏覽器支援度：建議使用最新版 Google Chrome、Microsoft Edge、Brave 或 Firefox 電腦版以獲得最佳硬體編碼與 Storage Estimate 支援。手機與平板因作業系統限制不支援網頁螢幕擷取。

---

🚀 如何使用

1. 使用 Google Chrome 或 Microsoft Edge 開啟目錄下的 index.html（或線上網址）。
2. 設定錄製偏好（模式、碼率、音訊與攝影機開關），並檢視硬碟剩餘空間與可錄時長。
3. 點擊「開始擷取與錄製」，並於瀏覽器彈窗中選取欲共用的畫面。
4. 錄製期間可隨時點擊「暫停」或「結束」，系統會即時守護硬碟空間。
5. 點擊「結束錄影」後，系統將自動修復時間軸並提供預覽回放與「下載影片檔」。