 JianMiauandClaude Fable 5
|
b324775f65
|
記住主題/模式/面板偏好,重開頁面自動還原
摘要:
深色模式、LIVE 模式與面板收合狀態存入 localStorage,
頁面載入時自動套用,不需每次手動切換。
根本原因:
theme/mode/panelOpen 只存在 Zustand 記憶體 state,
重新整理即重置為淺色 + 模擬模式。
影響:
使用者偏好跨重整保留;LIVE 偏好在開機時由 runtime.setMode 套用,
確保 SSE 連線流程正確執行。無痕模式等 localStorage 不可用時安全降級。
修法:
- office-store:loadPref/savePref 包裝(try/catch),
theme/panelOpen 初始值讀取,setTheme/setMode/togglePanel 寫入
- App:啟動時 loadPreferredMode() === "live" 則呼叫 setMode("live")
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
|
2026-07-20 14:29:38 +08:00 |
|
 JianMiauandClaude Fable 5
|
a8cb82cd6f
|
LIVE 模式可直接在辦公室對專案派發任務
摘要:
點選專案 agent 後可輸入任務派發,監看伺服器在該專案 cwd spawn
headless session(claude -p),執行過程即時演在辦公室,結束回報事件。
根本原因:
原本實況模式只能唯讀觀察 transcript,無法像 openclaw-office 的
chat.send 一樣從辦公室出手;缺一個能驅動真實 agent 的通道。
影響:
watcher 新增 POST /task(Origin 白名單 5173/5180、每專案排隊上限 3、
15 分鐘逾時);headless 以 acceptEdits 權限執行,等於允許 AI 改檔案,
僅限 localhost 使用。新產生的 session 檔改為從頭讀取,派發過程完整可視。
修法:
- server/watch.mjs:launchTask(prompt 走 stdin 防注入、--resume 支援、
stderr 摘要回報)、handleTaskRequest(CORS/驗證/排隊)、born-now 檔案從頭 tail
- live.ts:dispatchTask() + task_accepted/task_done 事件對映
- SidePanel:LIVE 模式 TaskComposer(textarea + 續 session 勾選 + Ctrl+Enter)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
|
2026-07-20 14:21:25 +08:00 |
|
 JianMiauandClaude Fable 5
|
1dc4920b32
|
RWD:直版改直向堆疊讓辦公室區域最大化
摘要:
直版/窄螢幕時辦公室改為滿寬顯示並鎖定 1200:700 比例,側邊面板移到下方;
另新增面板收合按鈕,桌面版也能全畫面看辦公室。
根本原因:
原本任何螢幕都是「辦公室 + 300px 側欄」左右排,SVG 以 meet 等比縮放,
直版視窗寬度受限時上下大量留白,辦公室被壓得很小。
影響:
直版(手機/平板)辦公室寬度從約一半提升到 100%;
窄橫版維持左右排但側欄縮為 232px;桌面版行為不變,多一顆 ⊞ 收合鈕。
修法:
- styles.css:orientation: portrait 時 main-row 改 column,
floorplan-wrap 用 aspect-ratio 1200/7 00 撐滿寬度,不再靠 flex 留白;
≤900px 壓縮 header(隱藏圖例/副標、按鈕縮小、允許換行)
- store 新增 panelOpen/togglePanel,App 據此條件渲染 SidePanel
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
|
2026-07-20 13:40:38 +08:00 |
|
 JianMiauandClaude Fable 5
|
f935a2ef2d
|
建立 Claude Office 虛擬辦公室(模擬 + 實況雙模式)
摘要:
參考 WW-AI-Lab/openclaw-office(MIT)的 office-2d 邏輯,重新實作 Claude 風格的
multi-agent 虛擬辦公室:四分區平面圖、走廊尋路、chibi 小人、狀態表情氣泡、
subagent 熱桌、會議聚集,以及可視化真實 Claude Code 活動的實況模式。
根本原因:
需要一個能一眼看出各專案 Claude Code 工作狀態(是否派發任務、調用工具、
派生 subagent)的監控介面,現有工具沒有對應的視覺化。
影響:
新專案,不影響既有系統。實況模式的監看伺服器僅綁 localhost:5179,
會讀取本機 ~/.claude/projects/ 的 session transcripts。
修法:
- Vite 6 + React 19 + Zustand,SVG 平面圖 + CSS 動畫,實測 60fps
- src/sim/director.ts:劇本模擬引擎(FSM + 會議排程)
- server/watch.mjs:零依賴 Node watcher,tail JSONL 轉譯為 SSE 事件
- src/gateway/live.ts:事件對映 store action,支援模式即時切換
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
|
2026-07-20 12:31:18 +08:00 |
|