mocode-pet-app 0.1.0 → 1.0.0

package/dist/assets/pets/17-mushroom-bot.svg

@@ -0,0 +1,47 @@
+<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="capGrad" x1="48" y1="30" x2="208" y2="110" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#ef5350"/>
+      <stop offset="1" stop-color="#c62828"/>
+    </linearGradient>
+    <linearGradient id="stemGrad" x1="80" y1="110" x2="176" y2="220" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#f5f5f5"/>
+      <stop offset="1" stop-color="#dcdcdc"/>
+    </linearGradient>
+    <filter id="glow" x="-30%" y="-30%" width="160%" height="160%">
+      <feGaussianBlur stdDeviation="3" result="blur"/>
+      <feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge>
+    </filter>
+  </defs>
+  <g id="pet-body-group">
+
+  <!-- Cap -->
+  <path d="M30 112 C30 54 72 22 128 22 C184 22 226 54 226 112 Z" fill="url(#capGrad)" stroke="#8e1c1c" stroke-width="2.5"/>
+  <circle cx="76" cy="70" r="10" fill="#fff" fill-opacity="0.85"/>
+  <circle cx="128" cy="50" r="8" fill="#fff" fill-opacity="0.85"/>
+  <circle cx="176" cy="74" r="9" fill="#fff" fill-opacity="0.85"/>
+  <circle cx="150" cy="98" r="6" fill="#fff" fill-opacity="0.75"/>
+
+  <!-- Stem / body -->
+  <rect x="72" y="108" width="112" height="120" rx="34" fill="url(#stemGrad)" stroke="#bdbdbd" stroke-width="2.5"/>
+
+  <!-- Screen face -->
+  <rect x="88" y="128" width="80" height="58" rx="12" fill="#0a1420" stroke="#2afadf" stroke-opacity="0.4" stroke-width="1.5"/>
+
+  <!-- Eyes -->
+  <g filter="url(#glow)">
+    <rect x="104" y="146" width="11" height="20" rx="5" fill="#2afadf">
+      <animate attributeName="height" values="20;2;20" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+      <animate attributeName="y" values="146;155;146" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </rect>
+    <rect x="142" y="146" width="11" height="20" rx="5" fill="#2afadf">
+      <animate attributeName="height" values="20;2;20" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+      <animate attributeName="y" values="146;155;146" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </rect>
+  </g>
+
+  <!-- Root feet -->
+  <ellipse cx="104" cy="238" rx="16" ry="8" fill="#bdbdbd"/>
+  <ellipse cx="152" cy="238" rx="16" ry="8" fill="#bdbdbd"/>
+  </g>
+</svg>

package/dist/assets/pets/18-star-bot.svg

@@ -0,0 +1,45 @@
+<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="starGrad" x1="48" y1="30" x2="208" y2="220" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#ffd54f"/>
+      <stop offset="1" stop-color="#ff8f00"/>
+    </linearGradient>
+    <filter id="glow" x="-30%" y="-30%" width="160%" height="160%">
+      <feGaussianBlur stdDeviation="3" result="blur"/>
+      <feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge>
+    </filter>
+  </defs>
+  <g id="pet-body-group">
+
+  <!-- Star body: 5-point star -->
+  <path d="M128 20
+           L156 92
+           L232 92
+           L170 138
+           L194 214
+           L128 168
+           L62 214
+           L86 138
+           L24 92
+           L100 92 Z"
+        fill="url(#starGrad)" stroke="#fff3c4" stroke-width="3">
+    <animateTransform attributeName="transform" type="rotate" values="0 128 128;6 128 128;0 128 128;-6 128 128;0 128 128" dur="4s" repeatCount="indefinite"/>
+  </path>
+
+  <!-- Screen face -->
+  <rect x="88" y="104" width="80" height="56" rx="12" fill="#0a1420" stroke="#ffe082" stroke-opacity="0.5" stroke-width="1.5"/>
+
+  <!-- Eyes -->
+  <g filter="url(#glow)">
+    <circle cx="112" cy="130" r="8" fill="#ffe082">
+      <animate attributeName="r" values="8;2;8" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </circle>
+    <circle cx="146" cy="130" r="8" fill="#ffe082">
+      <animate attributeName="r" values="8;2;8" keyTimes="0;0.5;1" dur="3.2s" repeatCount="indefinite"/>
+    </circle>
+  </g>
+
+  <!-- Smile -->
+  <path d="M114 148 Q128 158 142 148" stroke="#ffe082" stroke-width="3" fill="none" stroke-linecap="round"/>
+  </g>
+</svg>

package/dist/assets/pets/manifest.json

@@ -0,0 +1,25 @@
+{
+  "_description": "候选桌宠素材索引,供未来 desktop-pet '选皮' 功能读取。当前 packages/pet-app 实现仅使用 assets/mascot.svg(单一形象+CSS状态动画),这些素材是为后续换皮功能预留的候选库。",
+  "viewBox": "0 0 256 256",
+  "style": "赛博终端风,深色机身(#1b263b/#0d1b2a)+ 屏幕脸(黑底彩色像素眼,呼吸/眨眼动画),与 assets/mascot.svg 视觉语言一致",
+  "pets": [
+    { "id": "robo-cat",      "file": "01-robo-cat.svg",      "name": "机械猫",     "accent": "#2afadf" },
+    { "id": "robo-dog",      "file": "02-robo-dog.svg",      "name": "机械犬",     "accent": "#ffb74d" },
+    { "id": "robo-fox",      "file": "03-robo-fox.svg",      "name": "机械狐",     "accent": "#ff7043" },
+    { "id": "robo-panda",    "file": "04-robo-panda.svg",    "name": "机械熊猫",   "accent": "#2afadf" },
+    { "id": "robo-owl",      "file": "05-robo-owl.svg",      "name": "机械猫头鹰", "accent": "#7c4dff" },
+    { "id": "robo-bunny",    "file": "06-robo-bunny.svg",    "name": "机械兔",     "accent": "#ff6ec7" },
+    { "id": "robo-frog",     "file": "07-robo-frog.svg",     "name": "机械蛙",     "accent": "#00e676" },
+    { "id": "robo-bear",     "file": "08-robo-bear.svg",     "name": "机械熊",     "accent": "#ffa726" },
+    { "id": "robo-penguin",  "file": "09-robo-penguin.svg",  "name": "机械企鹅",   "accent": "#42a5f5" },
+    { "id": "robo-dino",     "file": "10-robo-dino.svg",     "name": "机械龙",     "accent": "#00c853" },
+    { "id": "slime-blob",    "file": "11-slime-blob.svg",    "name": "史莱姆",     "accent": "#00acc1" },
+    { "id": "ghost-byte",    "file": "12-ghost-byte.svg",    "name": "字节幽灵",   "accent": "#4dd0e1" },
+    { "id": "cactus-bot",    "file": "13-cactus-bot.svg",    "name": "仙人掌兽",   "accent": "#66bb6a" },
+    { "id": "crystal-bot",   "file": "14-crystal-bot.svg",   "name": "水晶精灵",   "accent": "#7c4dff" },
+    { "id": "satellite-bot", "file": "15-satellite-bot.svg", "name": "卫星兽",     "accent": "#42a5f5" },
+    { "id": "jellyfish-bot", "file": "16-jellyfish-bot.svg", "name": "水母兽",     "accent": "#ba68c8" },
+    { "id": "mushroom-bot",  "file": "17-mushroom-bot.svg",  "name": "菌菇兽",     "accent": "#c62828" },
+    { "id": "star-bot",      "file": "18-star-bot.svg",      "name": "星星兽",     "accent": "#ff8f00" }
+  ]
+}

package/dist/assets/signal-light.svg

@@ -0,0 +1,55 @@
+<svg id="signal-light-svg-root" width="90" height="456" viewBox="0 0 90 456" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="lampBodyGrad" x1="8" y1="8" x2="82" y2="212" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#1b263b"/>
+      <stop offset="1" stop-color="#0d1b2a"/>
+    </linearGradient>
+    <linearGradient id="lampAccentGrad" x1="8" y1="8" x2="82" y2="212" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#2afadf"/>
+      <stop offset="1" stop-color="#42a5f5"/>
+    </linearGradient>
+    <filter id="lampGlow" x="-100%" y="-100%" width="300%" height="300%">
+      <feGaussianBlur stdDeviation="4.5" result="blur"/>
+      <feMerge>
+        <feMergeNode in="blur"/>
+        <feMergeNode in="SourceGraphic"/>
+      </feMerge>
+    </filter>
+  </defs>
+
+  <!-- Housing -->
+  <rect x="10" y="8" width="72" height="204" rx="20" fill="url(#lampBodyGrad)" stroke="url(#lampAccentGrad)" stroke-width="3"/>
+
+  <!-- Lens visor hoods (purely decorative, echo the terminal-screen look of mascot.svg) -->
+  <path d="M20 40 Q46 24 72 40" stroke="url(#lampAccentGrad)" stroke-width="2" fill="none" stroke-opacity="0.45"/>
+  <path d="M20 95 Q46 79 72 95" stroke="url(#lampAccentGrad)" stroke-width="2" fill="none" stroke-opacity="0.45"/>
+  <path d="M20 150 Q46 134 72 150" stroke="url(#lampAccentGrad)" stroke-width="2" fill="none" stroke-opacity="0.45"/>
+
+  <!-- Lamps: default = dim (25% opacity of their own hue). CSS drives the active/blinking state
+       per PetState (see style.css "信号灯状态映射表"); ids are stable and must not be renamed. -->
+  <circle id="pet-lamp-red" cx="46" cy="55" r="20" fill="#f87171" fill-opacity="0.22" filter="url(#lampGlow)"/>
+  <circle id="pet-lamp-yellow" cx="46" cy="110" r="20" fill="#fbbf24" fill-opacity="0.22" filter="url(#lampGlow)"/>
+  <circle id="pet-lamp-green" cx="46" cy="165" r="20" fill="#4ade80" fill-opacity="0.22" filter="url(#lampGlow)"/>
+
+  <!-- Post: a single plain pole running from the housing all the way down toward ground level. -->
+  <rect x="41" y="212" width="10" height="200" rx="5" fill="url(#lampBodyGrad)" stroke="url(#lampAccentGrad)" stroke-width="3"/>
+
+  <!-- Collar ring: subtle detail where the pole meets the flared base, like real cast-iron
+       street lamp posts (a raised band, not just a bare pole-to-base joint). -->
+  <rect x="36" y="404" width="20" height="6" rx="3" fill="url(#lampAccentGrad)" fill-opacity="0.55"/>
+
+  <!-- Flared base: bell-shaped skirt widening from the pole down to the foot plate, echoing
+       the classic cast-iron lamp post base silhouette instead of a bare pole-in-a-block. -->
+  <path d="M40 410 C40 424 30 428 28 440 L64 440 C62 428 52 424 52 410 Z"
+        fill="url(#lampBodyGrad)" stroke="url(#lampAccentGrad)" stroke-width="3"/>
+
+  <!-- Foot plate: flat plinth the base is bolted to, slightly wider than the flare for a
+       grounded, load-bearing look; corner bolts add the "real hardware" detail. -->
+  <rect x="22" y="440" width="48" height="12" rx="4" fill="url(#lampBodyGrad)" stroke="url(#lampAccentGrad)" stroke-width="3"/>
+  <circle cx="29" cy="446" r="2" fill="url(#lampAccentGrad)" fill-opacity="0.7"/>
+  <circle cx="63" cy="446" r="2" fill="url(#lampAccentGrad)" fill-opacity="0.7"/>
+
+  <!-- Soft contact shadow: grounds the fixture visually, matching the drop-shadow treatment
+       used under other floating/standing pet skins. -->
+  <ellipse cx="46" cy="454" rx="26" ry="4" fill="#000000" fill-opacity="0.18"/>
+</svg>

package/dist/config.js

@@ -0,0 +1,42 @@
+// 桌宠本地持久化配置(悬浮窗位置 + 当前皮肤),存于 Electron userData 目录下的 pet-config.json。
+// 读写失败均静默降级为默认值——配置持久化是纯增强功能,不能影响桌宠正常启动/运行。
+import { app } from 'electron';
+import { readFileSync, writeFileSync, existsSync } from 'node:fs';
+import path from 'node:path';
+function configPath() {
+    return path.join(app.getPath('userData'), 'pet-config.json');
+}
+/** 读取持久化配置;文件不存在/内容非法均返回 {}(全部走默认值)。 */
+export function loadConfig() {
+    try {
+        const p = configPath();
+        if (!existsSync(p))
+            return {};
+        const raw = readFileSync(p, 'utf8');
+        const obj = JSON.parse(raw);
+        if (typeof obj !== 'object' || obj === null)
+            return {};
+        const o = obj;
+        const cfg = {};
+        if (typeof o.x === 'number')
+            cfg.x = o.x;
+        if (typeof o.y === 'number')
+            cfg.y = o.y;
+        if (typeof o.skinId === 'string')
+            cfg.skinId = o.skinId;
+        return cfg;
+    }
+    catch {
+        return {};
+    }
+}
+/** 合并写入持久化配置(浅合并;patch 里的字段覆盖旧值,未提供的字段保留)。 */
+export function saveConfig(patch) {
+    try {
+        const next = { ...loadConfig(), ...patch };
+        writeFileSync(configPath(), JSON.stringify(next), 'utf8');
+    }
+    catch {
+        // 静默:持久化失败不影响当前运行,下次启动回退默认值
+    }
+}

package/dist/main.js

@@ -1,11 +1,13 @@
 // 桌宠 Electron 主进程:WS Server 单例 + 最新连接覆盖 + BrowserWindow 生命周期。
 // 不感知 mocode CLI 内部逻辑,只是纯粹的状态转发枢纽:接收 WS state 消息 → IPC 推给渲染进程。
-import { app, BrowserWindow, screen } from 'electron';
+import { app, BrowserWindow, screen, Tray, Menu, nativeImage, ipcMain, } from 'electron';
 import { WebSocketServer, WebSocket } from 'ws';
 import { createServer as createHttpServer } from 'node:http';
 import { fileURLToPath } from 'node:url';
 import path from 'node:path';
 import { parseClientMessage, } from './protocol.js';
+import { loadConfig, saveConfig } from './config.js';
+import { listSkinEntries, resolveSkinPath } from './skins.js';
 const __dirname = path.dirname(fileURLToPath(import.meta.url));
 /** 默认端口;MOCODE_PET_PORT 环境变量覆盖(与 mocode 主包 src/pet/bridge.ts 保持一致的默认假设)。 */
 const DEFAULT_PORT = 47821;
@@ -23,7 +25,10 @@ const TRANSIENT_STATE_TIMEOUT_MS = 1500;
 const connections = new Map();
 let activeSocket = null;
 let mainWindow = null;
+let tray = null;
 let transientTimer = null;
+/** 当前生效的皮肤 id('default' = assets/mascot.svg);启动时从持久化配置读取,运行期随 set_skin/托盘菜单变化。 */
+let currentSkinId = 'default';
 /** 把状态推给渲染进程(IPC)。渲染进程窗口未就绪时静默丢弃(下次状态到达会重推)。 */
 function broadcastToRenderer(state, meta) {
     if (!mainWindow || mainWindow.isDestroyed())
@@ -45,6 +50,8 @@ function broadcastToRenderer(state, meta) {
             broadcastToRenderer('idle');
         }, TRANSIENT_STATE_TIMEOUT_MS);
     }
+    // waiting_human 不设超时:人工介入面板可能长时间悬挂等待用户响应,不能自动回落——
+    // 面板关闭后 CLI 侧(ask-human.ts / repl/index.ts)会显式广播下一个真实状态覆盖它。
 }
 /**
  * 新连接建立时的处理:注册 ConnectionRecord,立即成为唯一 active(覆盖之前的 active)。
@@ -113,10 +120,58 @@ function onMessage(socket, raw) {
                 return; // 非活跃连接的状态消息静默丢弃
             broadcastToRenderer(msg.state, msg.meta);
             return;
+        case 'shutdown':
+            // 关闭桌宠(方案C的 CLI 入口):不要求发送方是活跃连接,任何已连接的 mocode 进程均可请求关闭。
+            console.log('[pet-app] 收到 shutdown 请求,进程退出。');
+            app.quit();
+            return;
+        case 'set_skin':
+            applySkin(msg.skinId);
+            return;
+        case 'list_skins':
+            send(socket, {
+                type: 'skin_list',
+                skins: listSkinEntries().map((e) => ({ id: e.id, name: e.name })),
+                currentSkinId,
+                ts: Date.now(),
+            });
+            return;
         default:
             return;
     }
 }
+/** 切换皮肤:校验 skinId、更新内存态、持久化、通知渲染进程重新 inline 对应 SVG。
+ *  未知 skinId(非 'default' 且不在 manifest 里)静默忽略,不改变当前皮肤——选皮是可选增强,不能崩。 */
+function applySkin(skinId) {
+    if (skinId !== 'default' && !listSkinEntries().some((e) => e.id === skinId))
+        return;
+    currentSkinId = skinId;
+    saveConfig({ skinId });
+    pushSkinToRenderer();
+    rebuildTrayMenu();
+}
+/** 当前皮肤对应的素材相对路径(相对 renderer/index.html,供 fetch)。
+ *  renderer/index.html 位于 dist/renderer/,mascot.svg 在 dist/assets/,候选皮肤在 dist/assets/pets/。 */
+function currentSkinAssetPath() {
+    const abs = resolveSkinPath(currentSkinId);
+    return abs ? `../assets/pets/${path.basename(abs)}` : '../assets/mascot.svg';
+}
+/** 把当前皮肤推给渲染进程(运行期切换用,如托盘菜单点击 / CLI set_skin 消息)。
+ *  注:启动时的初始皮肤不走这条路径——渲染进程通过 'pet:get-skin' invoke 主动拉取,
+ *  避免 did-finish-load 与渲染进程异步注册监听器之间的时序竞争(IPC 消息不会缓冲,
+ *  若渲染进程监听器尚未注册,send 过去的消息会直接丢失,导致重启后持久化的皮肤不生效)。 */
+function pushSkinToRenderer() {
+    if (!mainWindow || mainWindow.isDestroyed())
+        return;
+    try {
+        mainWindow.webContents.send('pet:skin', { assetPath: currentSkinAssetPath() });
+    }
+    catch {
+        // 静默:渲染进程未就绪时忽略,下次运行期切换会重新推送
+    }
+}
+/** 渲染进程启动时主动拉取当前皮肤(同步于其自身初始化时机,不依赖 did-finish-load 的时序假设)。 */
+ipcMain.handle('pet:get-skin', () => ({ assetPath: currentSkinAssetPath() }));
 function send(socket, msg) {
     try {
         socket.send(JSON.stringify(msg));
@@ -225,16 +280,21 @@ function probeIsPetServer(port) {
         });
     });
 }
-/** 跨平台悬浮窗配置(design.md 跨平台 BrowserWindow 配置差异表)。 */
+const WIN_WIDTH = 260;
+const WIN_HEIGHT = 220;
+/** 跨平台悬浮窗配置(design.md 跨平台 BrowserWindow 配置差异表)。
+ *  位置:优先用持久化配置里的 x/y(拖拽放置后记住的位置);无记忆位置时回退默认右下角。 */
 function createPetWindow() {
-    const { width } = screen.getPrimaryDisplay().workAreaSize;
-    const winSize = 220;
+    const cfg = loadConfig();
+    const { width, height } = screen.getPrimaryDisplay().workAreaSize;
     const margin = 24;
+    const defaultX = width - WIN_WIDTH - margin;
+    const defaultY = height - WIN_HEIGHT - margin;
     const win = new BrowserWindow({
-        width: winSize,
-        height: winSize,
-        x: width - winSize - margin,
-        y: screen.getPrimaryDisplay().workAreaSize.height - winSize - margin,
+        width: WIN_WIDTH,
+        height: WIN_HEIGHT,
+        x: typeof cfg.x === 'number' ? cfg.x : defaultX,
+        y: typeof cfg.y === 'number' ? cfg.y : defaultY,
         transparent: true,
         frame: false,
         alwaysOnTop: true,
@@ -244,7 +304,8 @@ function createPetWindow() {
         fullscreenable: false,
         minimizable: false,
         maximizable: false,
-        focusable: false,
+        // 注:focusable 不再固定为 false——拖拽放置(方案:hover 时取消鼠标穿透)需要窗口在悬停时可交互。
+        // 仍不出现在任务栏/Alt-Tab(skipTaskbar),不会抢主输入焦点造成困扰。
         webPreferences: {
             preload: path.join(__dirname, 'renderer', 'preload.js'),
             contextIsolation: true,
@@ -258,8 +319,14 @@ function createPetWindow() {
     else {
         win.setAlwaysOnTop(true);
     }
-    // 鼠标穿透:允许用户点击桌面下层内容,不遮挡操作。悬浮窗本身仍可接收自身渲染的动画更新。
-    win.setIgnoreMouseEvents(true);
+    // 默认鼠标穿透(不遮挡桌面操作);forward:true 转发 mousemove,使渲染进程能收到 mouseenter/mouseleave
+    // 从而按 Electron 官方推荐模式动态请求取消穿透(见 preload.ts setIgnoreMouseEvents 转发 + renderer.ts 拖拽逻辑)。
+    win.setIgnoreMouseEvents(true, { forward: true });
+    // 拖拽放置后持久化窗口位置(见 renderer.ts 的 -webkit-app-region:drag 拖拽 + 此处 'moved' 事件落盘)。
+    win.on('moved', () => {
+        const [x, y] = win.getPosition();
+        saveConfig({ x, y });
+    });
     win.loadFile(path.join(__dirname, 'renderer', 'index.html'));
     win.webContents.on('render-process-gone', () => {
         // 渲染进程崩溃但主进程(WS Server)存活:重建一次窗口,不重启 WS Server、不断开现有客户端连接。
@@ -271,14 +338,89 @@ function createPetWindow() {
     });
     return win;
 }
+/** 渲染进程请求切换鼠标穿透状态(悬停时取消穿透以便拖拽,离开后恢复穿透)。见 preload.ts 转发。 */
+ipcMain.on('pet:set-ignore-mouse-events', (event, ignore) => {
+    const win = BrowserWindow.fromWebContents(event.sender);
+    win?.setIgnoreMouseEvents(ignore, { forward: true });
+});
+/** 拖拽会话的起始 bounds(仅在 mousedown 时读取一次,拖拽过程中绝不重新读取 win.getBounds())。
+ *  这是修复"越拖越大"的关键:Windows 在非 100% DPI 缩放下,setBounds/setPosition 存在已知的舍入误差
+ *  (见 https://github.com/electron/electron/issues/27651、#9477),每调一次尺寸就可能被系统悄悄放大
+ *  一点。如果每次 mousemove 都用"读当前 getSize() → 原样传回 setBounds"的方式,这个误差会不断累加——
+ *  上一次被放大的尺寸被读回来又原样设进去,越拖越大,永远回不去。正确做法是把宽高钉死为拖拽开始那一刻
+ *  的固定值,拖拽期间只用"起始坐标 + 累计位移"算新位置,never 把 setBounds 返回后可能已变化的尺寸再喂回去。 */
+let dragStartBounds = null;
+/** 拖拽开始:记录窗口初始 bounds(渲染进程 mousedown 时调用一次)。 */
+ipcMain.on('pet:drag-start', (event) => {
+    const win = BrowserWindow.fromWebContents(event.sender);
+    if (!win || win.isDestroyed())
+        return;
+    const b = win.getBounds();
+    dragStartBounds = { x: b.x, y: b.y, width: b.width, height: b.height };
+});
+/** 拖拽中:渲染进程传来"相对拖拽起点的累计位移"(不是相对上一帧的增量),
+ *  主进程据此从固定的起始 bounds 计算新位置,宽高恒为起始值,绝不重新读取当前窗口尺寸。 */
+ipcMain.on('pet:drag-move', (event, totalDx, totalDy) => {
+    const win = BrowserWindow.fromWebContents(event.sender);
+    if (!win || win.isDestroyed() || !dragStartBounds)
+        return;
+    win.setBounds({
+        x: Math.round(dragStartBounds.x + totalDx),
+        y: Math.round(dragStartBounds.y + totalDy),
+        width: dragStartBounds.width,
+        height: dragStartBounds.height,
+    });
+});
+/** 拖拽结束:清空起始 bounds 记录(渲染进程 mouseup 时调用)。 */
+ipcMain.on('pet:drag-end', () => {
+    dragStartBounds = null;
+});
+/** 构建/刷新托盘右键菜单:退出桌宠 + 选择宠物子菜单(单选,当前皮肤打勾)。 */
+function rebuildTrayMenu() {
+    if (!tray)
+        return;
+    const skinItems = [
+        {
+            label: '默认(mascot)',
+            type: 'radio',
+            checked: currentSkinId === 'default',
+            click: () => applySkin('default'),
+        },
+        ...listSkinEntries().map((e) => ({
+            label: e.name,
+            type: 'radio',
+            checked: currentSkinId === e.id,
+            click: () => applySkin(e.id),
+        })),
+    ];
+    const template = [
+        { label: 'mocode 桌宠', enabled: false },
+        { type: 'separator' },
+        { label: '选择宠物', submenu: skinItems },
+        { type: 'separator' },
+        { label: '退出桌宠', click: () => app.quit() },
+    ];
+    tray.setContextMenu(Menu.buildFromTemplate(template));
+}
+/** 创建系统托盘图标(方案C的桌面侧退出/选皮入口,弥补悬浮窗本身鼠标穿透+无边框导致的不可交互问题)。 */
+function createTray() {
+    // dist/main.js 与 dist/assets/ 同级(scripts/copy-static.mjs 把源码 assets/ 整体复制到 dist/assets/)。
+    const iconPath = path.join(__dirname, 'assets', 'tray-icon.png');
+    const icon = nativeImage.createFromPath(iconPath);
+    const t = new Tray(icon.isEmpty() ? nativeImage.createEmpty() : icon);
+    t.setToolTip('mocode 桌宠');
+    return t;
+}
 app.whenReady().then(async () => {
+    const cfg = loadConfig();
+    currentSkinId = cfg.skinId ?? 'default';
     const port = petPort();
     await startServer(port);
     startHeartbeatSweep();
     mainWindow = createPetWindow();
+    tray = createTray();
+    rebuildTrayMenu();
 });
-app.on('window-all-closed', () => {
-    // 用户关闭悬浮窗:整个桌宠进程退出(WS Server 一并关闭,已连 mocode 客户端会收到 close 事件,
-    // 按 bridge.ts 的"连接异常不自动重连"策略,下次 /pet 会重新探测并拉起新实例)。
-    app.quit();
-});
+// 不再监听 window-all-closed → app.quit():悬浮窗本身不可关闭(frame:false 且无关闭按钮),
+// 该事件设计上永不触发。退出统一走两个显式入口:托盘菜单"退出桌宠" 或 CLI 侧 shutdown 消息
+// (src/pet/bridge.ts killPetProcess,经 /pet quit 命令触发)。

package/dist/protocol.js

@@ -10,6 +10,7 @@ export const PET_STATES = [
     'done',
     'aborted',
     'error',
+    'waiting_human',
 ];
 /** 判断值是否为合法 PetState(供消息校验,非法值丢弃不崩)。 */
 export function isValidPetState(v) {
@@ -56,6 +57,16 @@ export function parseClientMessage(raw) {
             if (typeof m.clientId !== 'string')
                 return null;
             return { type: 'bye', clientId: m.clientId, ts: m.ts };
+        case 'shutdown':
+            if (typeof m.clientId !== 'string')
+                return null;
+            return { type: 'shutdown', clientId: m.clientId, ts: m.ts };
+        case 'set_skin':
+            if (typeof m.clientId !== 'string' || typeof m.skinId !== 'string')
+                return null;
+            return { type: 'set_skin', clientId: m.clientId, skinId: m.skinId, ts: m.ts };
+        case 'list_skins':
+            return { type: 'list_skins', ts: m.ts };
         default:
             return null;
     }
@@ -81,6 +92,20 @@ export function parseServerMessage(raw) {
             return { type: 'welcome', isActive: m.isActive, ts: m.ts };
         case 'pong':
             return { type: 'pong', ts: m.ts };
+        case 'skin_list': {
+            if (!Array.isArray(m.skins) || typeof m.currentSkinId !== 'string')
+                return null;
+            const skins = [];
+            for (const s of m.skins) {
+                if (!s || typeof s !== 'object')
+                    continue;
+                const ss = s;
+                if (typeof ss.id === 'string' && typeof ss.name === 'string') {
+                    skins.push({ id: ss.id, name: ss.name });
+                }
+            }
+            return { type: 'skin_list', skins, currentSkinId: m.currentSkinId, ts: m.ts };
+        }
         default:
             return null;
     }

package/dist/renderer/index.html

@@ -7,7 +7,10 @@
   <link rel="stylesheet" href="style.css" />
 </head>
 <body>
-  <div id="pet-container" class="pet-idle"></div>
+  <div id="pet-stage" class="pet-idle">
+    <div id="pet-container"></div>
+    <div id="signal-light-container"></div>
+  </div>
   <script src="renderer.js" type="module"></script>
 </body>
 </html>

package/dist/renderer/preload.js

@@ -1,10 +1,39 @@
+"use strict";
 // Electron preload:通过 contextBridge 把主进程 IPC 推送的状态安全暴露给渲染进程(contextIsolation=true,
 // 不给渲染进程任何 Node/Electron API 访问权限,只转发一个只读回调注册接口)。
-import { contextBridge, ipcRenderer } from 'electron';
-contextBridge.exposeInMainWorld('petBridge', {
+Object.defineProperty(exports, "__esModule", { value: true });
+const electron_1 = require("electron");
+electron_1.contextBridge.exposeInMainWorld('petBridge', {
     onState: (callback) => {
-        ipcRenderer.on('pet:state', (_event, payload) => {
+        electron_1.ipcRenderer.on('pet:state', (_event, payload) => {
             callback(payload.state, payload.meta);
         });
     },
+    /** 主进程推来的皮肤切换通知(运行期切换:托盘菜单选择 或 CLI set_skin 消息触发)。 */
+    onSkin: (callback) => {
+        electron_1.ipcRenderer.on('pet:skin', (_event, payload) => {
+            callback(payload.assetPath);
+        });
+    },
+    /** 启动时主动拉取当前皮肤(避免 did-finish-load 推送与监听器注册之间的时序竞争)。 */
+    getInitialSkin: () => electron_1.ipcRenderer.invoke('pet:get-skin'),
+    /** 转发鼠标穿透状态请求(拖拽放置功能:悬停/拖拽时取消穿透,离开后恢复穿透)。 */
+    setIgnoreMouseEvents: (ignore) => {
+        electron_1.ipcRenderer.send('pet:set-ignore-mouse-events', ignore);
+    },
+    /** 手动拖拽(替代不可靠的 -webkit-app-region:drag,见 style.css 顶部注释):
+     *  dragStart 在 mousedown 时调用一次,让主进程记住窗口起始 bounds;
+     *  dragMove 在 mousemove 时传"相对起点的累计位移"(不是相对上一帧的增量)——
+     *  这样主进程永远从固定的起始尺寸算新位置,不会因反复读取可能已被 Windows DPI 舍入误差
+     *  放大的当前尺寸而越拖越大(见 main.ts dragStartBounds 注释);
+     *  dragEnd 在 mouseup 时调用,清空起始记录。 */
+    dragStart: () => {
+        electron_1.ipcRenderer.send('pet:drag-start');
+    },
+    dragMove: (totalDx, totalDy) => {
+        electron_1.ipcRenderer.send('pet:drag-move', totalDx, totalDy);
+    },
+    dragEnd: () => {
+        electron_1.ipcRenderer.send('pet:drag-end');
+    },
 });