添加请她离开后猫可以坐在聊天框上的机制 (#1622)

* 添加请她离开后猫可以坐在聊天框上的机制

* 优化猫坐到聊天框顶部的触发逻辑：降低自动靠近的吸附感，并在猫被甩下或手动抓下后，要求重新放到聊天框 100px 内才允许再次触发坐上去

* BroadcastChannel.postMessage 加了 try/catch，失败返回 false

release timer 遇到已断开的 container 会提前返回

* 没有 compact surface 时：清掉 compactTopEdgeRearmRequired，不会把未来打开/移动的 compact 聊天框永久挡住

Author: MingTianSang

static/app-interpage.js

@@ -1647,6 +1647,59 @@
     var _yuiGuideChatFlushTimer = null;
     var _yuiGuideChatFlushAttempts = 0;
     var YUI_GUIDE_CHAT_FLUSH_MAX_ATTEMPTS = 50;
+    var IDLE_CHAT_COMPACT_SURFACE_HEARTBEAT_MS = 1000;
+    var idleChatCompactSurfaceHeartbeatTimer = 0;
+    var idleChatCompactSurfaceLastPayload = null;
+
+    function stopIdleChatCompactSurfaceHeartbeat() {
+        if (!idleChatCompactSurfaceHeartbeatTimer) return;
+        window.clearInterval(idleChatCompactSurfaceHeartbeatTimer);
+        idleChatCompactSurfaceHeartbeatTimer = 0;
+    }
+
+    function startIdleChatCompactSurfaceHeartbeat() {
+        if (idleChatCompactSurfaceHeartbeatTimer) return;
+        idleChatCompactSurfaceHeartbeatTimer = window.setInterval(function () {
+            if (!nekoBroadcastChannel ||
+                !idleChatCompactSurfaceLastPayload ||
+                !idleChatCompactSurfaceLastPayload.visible ||
+                !idleChatCompactSurfaceLastPayload.screenRect) {
+                stopIdleChatCompactSurfaceHeartbeat();
+                return;
+            }
+            nekoBroadcastChannel.postMessage(Object.assign({}, idleChatCompactSurfaceLastPayload, {
+                lanlan_name: getCurrentLanlanName(),
+                timestamp: Date.now(),
+                heartbeat: true
+            }));
+        }, IDLE_CHAT_COMPACT_SURFACE_HEARTBEAT_MS);
+    }
+
+    function syncIdleChatCompactSurfaceHeartbeat(payload) {
+        idleChatCompactSurfaceLastPayload = payload || null;
+        if (payload && payload.visible && payload.screenRect) {
+            startIdleChatCompactSurfaceHeartbeat();
+            return;
+        }
+        stopIdleChatCompactSurfaceHeartbeat();
+    }
+
+    function postIdleChatCompactSurfaceState(detail) {
+        if (!nekoBroadcastChannel) return;
+        var screenRect = detail && detail.screenRect ? detail.screenRect : null;
+        var payload = {
+            action: 'idle_chat_compact_surface_state',
+            source: 'chat-window',
+            lanlan_name: getCurrentLanlanName(),
+            visible: !!screenRect,
+            screenRect: screenRect,
+            resizeActive: !!(detail && detail.resizeActive),
+            dragging: !!(detail && detail.dragging),
+            timestamp: Date.now()
+        };
+        nekoBroadcastChannel.postMessage(payload);
+        syncIdleChatCompactSurfaceHeartbeat(payload);
+    }
 
     function scheduleYuiGuideChatMessageFlush(delay) {
         if (_yuiGuideChatFlushTimer) return;
@@ -1820,6 +1873,18 @@
                         dispatchIdleChatMinimizedState(event.data);
                         break;
                     }
+                    case 'idle_chat_compact_surface_state': {
+                        var compactSurfaceCurrentName = getCurrentLanlanName();
+                        if (event.data.lanlan_name && (!compactSurfaceCurrentName || event.data.lanlan_name !== compactSurfaceCurrentName)) break;
+                        dispatchIdleChatCompactSurfaceState(event.data);
+                        break;
+                    }
+                    case 'idle_cat1_compact_mirror_state': {
+                        var cat1MirrorCurrentName = getCurrentLanlanName();
+                        if (event.data.lanlan_name && (!cat1MirrorCurrentName || event.data.lanlan_name !== cat1MirrorCurrentName)) break;
+                        dispatchIdleCat1CompactMirrorState(event.data);
+                        break;
+                    }
                     case 'idle_chat_pair_move_bounds': {
                         var pairMoveChatCurrentName = getCurrentLanlanName();
                         if (event.data.lanlan_name && (!pairMoveChatCurrentName || event.data.lanlan_name !== pairMoveChatCurrentName)) break;
@@ -2113,6 +2178,40 @@
         }));
     }
 
+    function dispatchIdleChatCompactSurfaceState(detail) {
+        window.dispatchEvent(new CustomEvent('neko:idle-chat-compact-surface-state', {
+            detail: Object.assign({
+                action: 'idle_chat_compact_surface_state',
+                source: '',
+                reason: '',
+                visible: false,
+                screenRect: null,
+                timestamp: Date.now(),
+                via: 'broadcast-channel'
+            }, detail || {}, {
+                via: 'broadcast-channel'
+            })
+        }));
+    }
+
+    function dispatchIdleCat1CompactMirrorState(detail) {
+        window.dispatchEvent(new CustomEvent('neko:idle-cat1-compact-mirror-state', {
+            detail: Object.assign({
+                action: 'idle_cat1_compact_mirror_state',
+                source: '',
+                reason: '',
+                active: false,
+                surfaceScreenRect: null,
+                anchorRatio: null,
+                catRect: null,
+                timestamp: Date.now(),
+                via: 'broadcast-channel'
+            }, detail || {}, {
+                via: 'broadcast-channel'
+            })
+        }));
+    }
+
     function dispatchIdleChatPairMoveBounds(detail) {
         window.dispatchEvent(new CustomEvent('neko:idle-chat-pair-move-bounds', {
             detail: Object.assign({
@@ -2308,6 +2407,11 @@
         }, detail));
     });
 
+    window.addEventListener('neko:compact-surface-layout-change', function (evt) {
+        var detail = evt && evt.detail && typeof evt.detail === 'object' ? evt.detail : null;
+        postIdleChatCompactSurfaceState(detail);
+    });
+
     // Chat 窗口初始化时，向 Pet 窗口请求当前已缓存的头像
     if (isStandaloneChatPage() && nekoBroadcastChannel) {
         var initialLanlanName = (window.lanlan_config && window.lanlan_config.lanlan_name) || '';

static/app-react-chat-window.js

@@ -261,6 +261,11 @@
     var compactSurfacePendingModelOpen = false;
     var compactSurfaceResizeSession = null;
     var compactSurfaceDesktopResizeActive = false;
+    var compactSurfaceDesktopDragActive = false;
+    var IDLE_CAT1_COMPACT_MIRROR_TIMEOUT_MS = 1600;
+    var idleCat1CompactMirrorElement = null;
+    var idleCat1CompactMirrorTimer = 0;
+    var idleCat1CompactMirrorLastDetail = null;
 
     function normalizeCompactDesktopRect(raw) {
         if (!raw) return null;
@@ -306,6 +311,7 @@
     }
 
     function handleDesktopCompactLayoutChange(layout) {
+        compactSurfaceDesktopDragActive = !!(layout && layout.dragging);
         var nextAnchorSnapshot = getCompactDesktopLayoutAnchorSnapshot(layout);
         var baseAnchorChanged = false;
         if (!nextAnchorSnapshot) {
@@ -641,6 +647,142 @@
         };
     }
 
+    function getIdleCat1CompactMirrorElement() {
+        if (idleCat1CompactMirrorElement && idleCat1CompactMirrorElement.isConnected) {
+            return idleCat1CompactMirrorElement;
+        }
+        var host = document.body;
+        if (!host) return null;
+        var element = document.createElement('div');
+        element.id = 'neko-idle-cat1-compact-mirror';
+        element.className = 'neko-idle-cat1-compact-mirror';
+        element.setAttribute('data-compact-geometry-owner', 'surface');
+        element.setAttribute('data-compact-geometry-item', 'cat1Mirror');
+        element.setAttribute('aria-hidden', 'true');
+        element.hidden = true;
+        var image = document.createElement('img');
+        image.className = 'neko-idle-cat1-compact-mirror-art';
+        image.alt = '';
+        image.draggable = false;
+        element.appendChild(image);
+        host.appendChild(element);
+        idleCat1CompactMirrorElement = element;
+        return element;
+    }
+
+    function clearIdleCat1CompactMirrorTimer() {
+        if (!idleCat1CompactMirrorTimer) return;
+        window.clearTimeout(idleCat1CompactMirrorTimer);
+        idleCat1CompactMirrorTimer = 0;
+    }
+
+    function hideIdleCat1CompactMirror(reason) {
+        clearIdleCat1CompactMirrorTimer();
+        var element = idleCat1CompactMirrorElement;
+        if (element) {
+            element.hidden = true;
+            element.removeAttribute('data-active');
+            element.style.removeProperty('left');
+            element.style.removeProperty('top');
+            element.style.removeProperty('width');
+            element.style.removeProperty('height');
+        }
+        idleCat1CompactMirrorLastDetail = null;
+        scheduleCompactMinimizeBallTracking();
+        syncCompactInteractionGeometry();
+    }
+
+    function getIdleCat1CompactMirrorWindowBounds() {
+        var windowBounds = getCompactSurfaceDesktopWindowBounds();
+        if (windowBounds) return windowBounds;
+        var x = Number(window.screenX);
+        var y = Number(window.screenY);
+        return {
+            x: Number.isFinite(x) ? x : 0,
+            y: Number.isFinite(y) ? y : 0
+        };
+    }
+
+    function getIdleCat1CompactMirrorPageRect(detail) {
+        var surface = normalizeCompactDesktopRect(detail && detail.surfaceScreenRect);
+        if (!surface) return null;
+        var catRect = detail && detail.catRect ? detail.catRect : null;
+        var catWidth = Math.round(Number(catRect && catRect.width) || 112);
+        var catHeight = Math.round(Number(catRect && catRect.height) || 112);
+        if (catWidth <= 0 || catHeight <= 0) return null;
+        var windowBounds = getIdleCat1CompactMirrorWindowBounds();
+        var surfaceLeft = surface.left - (Number(windowBounds.x) || 0);
+        var surfaceTop = surface.top - (Number(windowBounds.y) || 0);
+        var sidePadding = Math.max(0, Number(detail && detail.sidePaddingPx) || 12);
+        var capInset = Math.max(sidePadding, surface.height / 2 + sidePadding);
+        var edgePadding = Math.min(capInset, Math.max(0, surface.width / 2));
+        var minCenterX = surfaceLeft + edgePadding;
+        var maxCenterX = surfaceLeft + surface.width - edgePadding;
+        var ratio = Number(detail && detail.anchorRatio);
+        if (!Number.isFinite(ratio)) ratio = 0.5;
+        ratio = Math.max(0, Math.min(1, ratio));
+        var centerX = maxCenterX >= minCenterX
+            ? minCenterX + (maxCenterX - minCenterX) * ratio
+            : surfaceLeft + surface.width / 2;
+        var overlap = Number(detail && detail.overlapPx);
+        if (!Number.isFinite(overlap)) overlap = 28;
+        return {
+            left: Math.round(centerX - catWidth / 2),
+            top: Math.round(surfaceTop - catHeight + overlap),
+            width: catWidth,
+            height: catHeight
+        };
+    }
+
+    function showIdleCat1CompactMirror(detail) {
+        var element = getIdleCat1CompactMirrorElement();
+        var rect = getIdleCat1CompactMirrorPageRect(detail);
+        if (!element || !rect) {
+            hideIdleCat1CompactMirror('invalid');
+            return;
+        }
+        idleCat1CompactMirrorLastDetail = Object.assign({}, detail || {});
+        var image = element.querySelector('.neko-idle-cat1-compact-mirror-art');
+        if (image) {
+            var src = detail && detail.assetUrl ? String(detail.assetUrl) : '/static/assets/neko-idle/cat-idle-cat1.gif';
+            if (image.getAttribute('src') !== src) image.setAttribute('src', src);
+            image.style.transform = detail && detail.facingRight ? 'scaleX(-1)' : 'scaleX(1)';
+        }
+        element.style.left = rect.left + 'px';
+        element.style.top = rect.top + 'px';
+        element.style.width = rect.width + 'px';
+        element.style.height = rect.height + 'px';
+        element.hidden = false;
+        element.setAttribute('data-active', 'true');
+        clearIdleCat1CompactMirrorTimer();
+        idleCat1CompactMirrorTimer = window.setTimeout(function () {
+            hideIdleCat1CompactMirror('timeout');
+        }, IDLE_CAT1_COMPACT_MIRROR_TIMEOUT_MS);
+        scheduleCompactMinimizeBallTracking();
+        syncCompactInteractionGeometry();
+    }
+
+    function refreshIdleCat1CompactMirrorPosition() {
+        var element = idleCat1CompactMirrorElement;
+        if (!element || element.hidden || !idleCat1CompactMirrorLastDetail) return;
+        var rect = getIdleCat1CompactMirrorPageRect(idleCat1CompactMirrorLastDetail);
+        if (!rect) return;
+        element.style.left = rect.left + 'px';
+        element.style.top = rect.top + 'px';
+        element.style.width = rect.width + 'px';
+        element.style.height = rect.height + 'px';
+        syncCompactInteractionGeometry();
+    }
+
+    function handleIdleCat1CompactMirrorState(event) {
+        var detail = event && event.detail && typeof event.detail === 'object' ? event.detail : null;
+        if (!detail || !detail.active) {
+            hideIdleCat1CompactMirror(detail && detail.reason ? detail.reason : 'inactive');
+            return;
+        }
+        showIdleCat1CompactMirror(detail);
+    }
+
     function dispatchCompactSurfaceLayoutChange(rect) {
         var detail = rect || null;
         if (detail && isElectronChatWindow()) {
@@ -649,6 +791,11 @@
                 resizeActive: !!compactSurfaceResizeSession
             });
         }
+        if (detail) {
+            detail = Object.assign({}, detail, {
+                dragging: !!(dragState && dragState.compactSurface) || compactSurfaceDesktopDragActive
+            });
+        }
         window.dispatchEvent(new CustomEvent('neko:compact-surface-layout-change', {
             detail: detail
         }));
@@ -1018,7 +1165,7 @@
         var item = element.getAttribute('data-compact-geometry-item') || '';
         if (item === 'choice' && element.getAttribute('data-choice-layer-open') !== 'true') return false;
         if (item === 'toolFan' && element.getAttribute('data-compact-input-tool-fan-open') !== 'true') return false;
-        if (element.getAttribute('aria-hidden') === 'true' && item !== 'resizeHandle') return false;
+        if (element.getAttribute('aria-hidden') === 'true' && item !== 'resizeHandle' && item !== 'cat1Mirror') return false;
         var style = window.getComputedStyle ? window.getComputedStyle(element) : null;
         if (style && (style.display === 'none' || style.visibility === 'hidden')) return false;
         return true;
@@ -1275,12 +1422,28 @@
                 !root.contains(element)
                 && !element.classList.contains('compact-input-tool-fan')
                 && !element.classList.contains('compact-chat-choice-anchor')
+                && !element.classList.contains('neko-idle-cat1-compact-mirror')
             ) return items;
             if (!shouldIncludeCompactGeometryElement(element)) return items;
             var compactGeometryItem = element.getAttribute('data-compact-geometry-item');
             if (compactGeometryItem === 'toolFan') {
                 return items.concat(collectCompactToolFanGeometryItems(element));
             }
+            if (compactGeometryItem === 'cat1Mirror') {
+                var mirrorRect = getCompactGeometryElementRect(element);
+                if (mirrorRect) {
+                    items.push({
+                        id: 'cat1Mirror:native',
+                        owner: 'surface',
+                        kind: 'cat1Mirror',
+                        visualRect: mirrorRect,
+                        hitRect: null,
+                        nativeRect: mirrorRect,
+                        interactive: false
+                    });
+                }
+                return items;
+            }
             if (element.getAttribute('data-compact-geometry-hit-scope') === 'children') {
                 return items.concat(collectCompactCompositeGeometryItems(element, compactGeometryItem));
             }
@@ -1409,7 +1572,8 @@
             Math.round(target.left),
             Math.round(target.top),
             Math.round(target.width),
-            Math.round(target.height || COMPACT_SURFACE_DEFAULT_HEIGHT)
+            Math.round(target.height || COMPACT_SURFACE_DEFAULT_HEIGHT),
+            (!!(dragState && dragState.compactSurface) || compactSurfaceDesktopDragActive) ? 'dragging' : 'idle'
         ].join(':');
         if (snapshot === compactSurfaceAnchorSnapshot) {
             return;
@@ -4746,6 +4910,7 @@
         cancelActiveAnimation(); // 清理进行中的折叠/展开回调
         clearIdleDockState();
         deactivateToolCursor();
+        hideIdleCat1CompactMirror('close-window');
 
         // 如果当前处于最小化状态，恢复 shell 到正常态
         if (minimized) {
@@ -4860,6 +5025,7 @@
         var changedTouch = opts.changedTouches && opts.changedTouches.length > 0 ? opts.changedTouches[0] : null;
 
         var wasMoved = dragState.moved;
+        var wasCompactSurface = !!dragState.compactSurface;
 
         var shell = getShell();
         if (shell) {
@@ -4872,6 +5038,12 @@
 
         dragState = null;
         document.body.classList.remove('react-chat-window-dragging');
+        if (wasCompactSurface && wasMoved) {
+            var compactRect = getCurrentCompactSurfaceRect();
+            if (compactRect) {
+                dispatchCompactSurfaceLayoutChange(compactRect);
+            }
+        }
 
         // 移动过的拖拽不该再变成点击：吞掉 mouseup 落点补发的那一次 click。
         if (wasMoved) {
@@ -5452,6 +5624,7 @@
             if (!detail) return;
             scheduleElectronCat1PairMoveBounds(detail.screenRect || detail.bounds);
         });
+        window.addEventListener('neko:idle-cat1-compact-mirror-state', handleIdleCat1CompactMirrorState);
         window.addEventListener('live2d-return-click', function () {
             if (hasElectronIdleDockPendingOrActive()) { exitElectronIdleDock(); }
             if (hasIdleDockPendingOrActive()) { exitIdleDock(); return; }
@@ -5471,6 +5644,7 @@
         window.addEventListener('neko:desktop-compact-layout-change', function (event) {
             var layout = event && event.detail ? event.detail : window.__nekoDesktopCompactLayout;
             handleDesktopCompactLayoutChange(layout || null);
+            refreshIdleCat1CompactMirrorPosition();
         });
         if (window.__nekoDesktopCompactLayout) {
             handleDesktopCompactLayoutChange(window.__nekoDesktopCompactLayout);