@mindexec/cli 0.2.445 → 0.2.447

package/wwwroot/_content/MindExecution.Shared/js/mind-map-interactions.js

@@ -9,6 +9,7 @@ window.MindMapInteractions = (function () {
     const PRIMARY_CLICK_DELAY_MS = 280;
     const BACKGROUND_PRIMARY_CLICK_DELAY_MS = 320;
     const eventHandlers = new WeakMap();
+    const pointerHitContexts = new WeakMap();
     const _tmpDragPos = new THREE.Vector3();
     const _tmpMultiDragPos = new THREE.Vector3();
     const BROWSER_SELECTION_LOCK_CLASS = 'mindcanvas-browser-selection-locked';
@@ -1288,21 +1289,18 @@ window.MindMapInteractions = (function () {
         const meshes = [];
         let residentHit = null;
         if (module.raycaster.ray.intersectPlane(module.plane, module.intersectPoint)) {
-            meshes.push(...getNearbyMeshes(module, module.intersectPoint));
-            if (meshes.length === 0 && module.nodeObjectsById?.size > 0) {
-                module.nodeObjectsById.forEach((entry) => {
-                    const glObject = entry?.glObject;
-                    if (glObject && (glObject.isMesh || glObject.children?.length > 0)) {
-                        meshes.push(glObject);
-                    }
-                });
+            const nearbyMeshes = getNearbyMeshes(module, module.intersectPoint);
+            meshes.push(...nearbyMeshes);
+            meshes._hitTestCandidatesAvailable = nearbyMeshes._hitTestCandidatesAvailable === true;
+            if (meshes.length === 0 && meshes._hitTestCandidatesAvailable !== true && module.nodeObjectsById?.size > 0) {
+                appendFallbackMeshes(module, module.intersectPoint, meshes);
             }
             residentHit = module.lodRenderer?.pickResidentNodeAtWorldPoint?.(module.intersectPoint) || null;
         }
         const topHit = getTopIntersectionHit(module, module.raycaster.intersectObjects(meshes, true));
         const topNodeId = resolveNodeIdFromHitObject(topHit?.object);
         const topPriority = topHit ? getIntersectionInteractionPriority(module, topHit) : -Infinity;
-        const cssHit = findCssNodeHitAtClientPoint(module, e.clientX, e.clientY);
+        const cssHit = getPointerCssHit(module, e);
         if (cssHit?.nodeId && (!topHit || (cssHit.nodeId !== topNodeId && (cssHit.priority ?? -Infinity) >= topPriority))) {
             return cssHit.nodeId;
         }
@@ -1651,65 +1649,18 @@ window.MindMapInteractions = (function () {
         return null;
     }
 
-    function getNodeProjectedClientFrame(module, entry) {
-        if (!module?.camera || !module?.container || !entry) {
-            return null;
-        }
-
-        const rect = module.container.getBoundingClientRect?.();
-        if (!rect || rect.width <= 0 || rect.height <= 0) {
-            return null;
-        }
-
-        const sourceObject = entry.glObject || entry.cssObject;
-        const position = sourceObject?.position;
-        if (!position) {
-            return null;
-        }
-
-        const width = Number(
-            entry.glObject?.userData?.worldWidth ||
-            entry.cssObject?.userData?.worldWidth ||
-            entry.model?.width ||
-            entry.model?.Width ||
-            0
-        );
-        const height = Number(
-            entry.glObject?.userData?.worldHeight ||
-            entry.cssObject?.userData?.worldHeight ||
-            entry.model?.height ||
-            entry.model?.Height ||
-            0
-        );
-        if (!(width > 0 && height > 0)) {
-            return null;
-        }
-
-        const corners = [
-            new THREE.Vector3(position.x, position.y, position.z || 0),
-            new THREE.Vector3(position.x + width, position.y, position.z || 0),
-            new THREE.Vector3(position.x, position.y - height, position.z || 0),
-            new THREE.Vector3(position.x + width, position.y - height, position.z || 0)
-        ];
-
-        const xs = [];
-        const ys = [];
-        for (const corner of corners) {
-            corner.project(module.camera);
-            xs.push(rect.left + ((corner.x + 1) * rect.width / 2));
-            ys.push(rect.top + ((-corner.y + 1) * rect.height / 2));
-        }
-
-        return {
-            left: Math.min(...xs),
-            right: Math.max(...xs),
-            top: Math.min(...ys),
-            bottom: Math.max(...ys)
-        };
+    function getNodeProjectedClientFrame(module, entry, context = null, nodeId = null) {
+        return window.MindMapCss3dHotPath?.getProjectedClientFrame?.(
+            module,
+            entry,
+            context,
+            getCachedViewportMetrics(module),
+            nodeId
+        ) || null;
     }
 
-    function isClientPointInsideNodeFrame(module, entry, clientX, clientY, padding = 2) {
-        const frame = getNodeProjectedClientFrame(module, entry);
+    function isClientPointInsideNodeFrame(module, entry, clientX, clientY, padding = 2, context = null, nodeId = null) {
+        const frame = getNodeProjectedClientFrame(module, entry, context, nodeId);
         if (!frame) {
             return true;
         }
@@ -1720,13 +1671,13 @@ window.MindMapInteractions = (function () {
             clientY <= frame.bottom + padding;
     }
 
-    function isOutOfFrameNodeDomHit(module, nodeId, clientX, clientY) {
+    function isOutOfFrameNodeDomHit(module, nodeId, clientX, clientY, context = null) {
         const entry = nodeId ? module?.nodeObjectsById?.get?.(nodeId) : null;
         if (!entry?.cssObject?.element) {
             return false;
         }
 
-        return !isClientPointInsideNodeFrame(module, entry, clientX, clientY, 3);
+        return !isClientPointInsideNodeFrame(module, entry, clientX, clientY, 3, context, nodeId);
     }
 
     function resolveNodeIdFromHitObject(object) {
@@ -1873,13 +1824,15 @@ window.MindMapInteractions = (function () {
         return bestHit;
     }
 
-    function findCssNodeHitAtClientPoint(module, clientX, clientY) {
+    function findCssNodeHitAtClientPoint(module, clientX, clientY, context = null) {
         if (!module?.nodeObjectsById) {
             return null;
         }
 
         if (typeof document !== 'undefined' && typeof document.elementsFromPoint === 'function') {
-            const domStack = document.elementsFromPoint(clientX, clientY);
+            const domStack = context
+                ? window.MindMapCss3dHotPath.getDomStack(module, context)
+                : document.elementsFromPoint(clientX, clientY);
             let bestHit = null;
             let bestPriority = -Infinity;
 
@@ -1905,7 +1858,7 @@ window.MindMapInteractions = (function () {
                     continue;
                 }
 
-                if (!isClientPointInsideNodeFrame(module, entry, clientX, clientY, 2)) {
+                if (!isClientPointInsideNodeFrame(module, entry, clientX, clientY, 2, context, nodeId)) {
                     continue;
                 }
 
@@ -1929,9 +1882,13 @@ window.MindMapInteractions = (function () {
 
         let bestHit = null;
         let bestPriority = -Infinity;
-        const worldPoint = getWorldPoint(module, clientX, clientY);
-        const candidateIds = getCssFallbackCandidateIds(module, worldPoint);
-
+        const worldPoint = window.MindMapCss3dHotPath
+            ? window.MindMapCss3dHotPath.getContextWorldPoint(
+                context,
+                () => getWorldPoint(module, clientX, clientY)
+            )
+            : getWorldPoint(module, clientX, clientY);
+        const candidateIds = getCssFallbackCandidateIds(module, worldPoint, context);
         for (let i = 0; i < candidateIds.length; i++) {
             const nodeId = candidateIds[i];
             const entry = module.nodeObjectsById.get(nodeId);
@@ -1948,7 +1905,7 @@ window.MindMapInteractions = (function () {
                 continue;
             }
 
-            if (!isClientPointInsideNodeFrame(module, entry, clientX, clientY, 2)) {
+            if (!isClientPointInsideNodeFrame(module, entry, clientX, clientY, 2, context, nodeId)) {
                 continue;
             }
 
@@ -1971,7 +1928,6 @@ window.MindMapInteractions = (function () {
         let bestHit = null;
         let bestPriority = -Infinity;
         const candidateIds = getCssFallbackCandidateIds(module, worldPoint);
-
         for (let i = 0; i < candidateIds.length; i++) {
             const nodeId = candidateIds[i];
             const entry = module.nodeObjectsById.get(nodeId);
@@ -2134,6 +2090,7 @@ window.MindMapInteractions = (function () {
     }
 
     function getHitTestCandidateNodeIds(module, point, options = {}) {
+        if (!module?.nodeObjectsById || !point) return null;
         const normalizedCellRadius = Math.max(0, Math.min(3, Math.round(Number(options.cellRadius || 1))));
         module?.logicWorkerBridge?.primeHitTestCandidates?.(module, {
             point,
@@ -2145,10 +2102,20 @@ window.MindMapInteractions = (function () {
             cellRadius: normalizedCellRadius
         });
         if (Array.isArray(cachedCandidateIds)) {
+            module._lastHitTestCandidateSource = 'worker';
+            window.MindMapCss3dHotPath?.recordHitCandidates?.(module, 'worker', cachedCandidateIds.length);
             return cachedCandidateIds;
         }
 
-        return collectLocalHitTestCandidateNodeIds(module, point, normalizedCellRadius);
+        if (!module.spatialGrid || module._spatialIndexRepairState) {
+            module._lastHitTestCandidateSource = 'unavailable';
+            window.MindMapCss3dHotPath?.noteUnavailableIndex?.(module, 'pointer-index-unavailable');
+            return null;
+        }
+        const localIds = collectLocalHitTestCandidateNodeIds(module, point, normalizedCellRadius);
+        module._lastHitTestCandidateSource = 'spatial-grid';
+        window.MindMapCss3dHotPath?.recordHitCandidates?.(module, 'spatial-grid', localIds.length);
+        return localIds;
     }
 
     function appendMeshesForHitTestCandidateIds(module, candidateIds, meshes, options = {}) {
@@ -2188,10 +2155,14 @@ window.MindMapInteractions = (function () {
     function getNearbyMeshes(module, point, options = {}) {
         const candidateIds = getHitTestCandidateNodeIds(module, point, options);
         const meshes = [];
+        meshes._hitTestCandidatesAvailable = Array.isArray(candidateIds);
         appendMeshesForHitTestCandidateIds(module, candidateIds, meshes, options);
         return meshes;
     }
 
+    function appendFallbackMeshes(module, point, meshes) {
+        (getCssFallbackCandidateIds(module, point) || []).forEach(id => { const g = module.nodeObjectsById.get(id)?.glObject; if (g && (g.isMesh || g.children?.length > 0)) meshes.push(g); });
+    }
     function buildSelectionRectFromWorldPoints(worldStartPos, worldEndPos) {
         if (!worldStartPos || !worldEndPos) {
             return null;
@@ -2205,49 +2176,19 @@ window.MindMapInteractions = (function () {
         };
     }
 
-    function collectLocalSelectionCandidateNodeIds(module, selectionRect) {
-        if (!module?.spatialGrid || !selectionRect) {
-            return [];
-        }
-
-        const cellSize = Math.max(1, Number(module.GRID_CELL_SIZE || 500));
-        const startCellX = Math.floor(Number(selectionRect.left || 0) / cellSize);
-        const endCellX = Math.floor(Number(selectionRect.right || 0) / cellSize);
-        const startCellY = Math.floor(Number(selectionRect.bottom || 0) / cellSize);
-        const endCellY = Math.floor(Number(selectionRect.top || 0) / cellSize);
-        const candidateIds = [];
-        const seenIds = new Set();
-
-        for (let cellX = startCellX; cellX <= endCellX; cellX++) {
-            for (let cellY = startCellY; cellY <= endCellY; cellY++) {
-                const nodeIds = module.spatialGrid.get(`${cellX}:${cellY}`);
-                if (!nodeIds) {
-                    continue;
-                }
-
-                nodeIds.forEach((nodeId) => {
-                    const normalizedNodeId = String(nodeId || '').trim();
-                    if (!normalizedNodeId || seenIds.has(normalizedNodeId)) {
-                        return;
-                    }
-
-                    seenIds.add(normalizedNodeId);
-                    candidateIds.push(normalizedNodeId);
-                });
-            }
-        }
-
-        return candidateIds;
-    }
-
     function collectSelectionBoxNodeIdsLocal(module, selectionRect) {
         const selectedIds = new Set();
         if (!module?.nodeObjectsById || !selectionRect) {
             return selectedIds;
         }
 
-        const candidateIds = collectLocalSelectionCandidateNodeIds(module, selectionRect);
+        let candidateIds = window.MindMapCss3dHotPath?.collectSpatialRectCandidateIds?.(module, selectionRect) ?? null;
+        if (candidateIds === null) {
+            window.MindMapCss3dHotPath?.noteUnavailableIndex?.(module, 'selection-box-index-unavailable');
+            candidateIds = window.MindMapCss3dHotPath?.getBoundedFallbackIds?.(module) || [];
+        }
         const processCandidateNode = (nodeId) => {
+            window.MindMapCss3dHotPath?.increment?.(module, 'selection', 'nodesVisited');
             const nodeEntry = module.nodeObjectsById.get(nodeId);
             if (!nodeEntry?.glObject?.userData) {
                 return;
@@ -2269,12 +2210,8 @@ window.MindMapInteractions = (function () {
             }
         };
 
-        if (candidateIds.length > 0) {
-            for (let i = 0; i < candidateIds.length; i++) {
-                processCandidateNode(candidateIds[i]);
-            }
-        } else {
-            module.nodeObjectsById.forEach((_, nodeId) => processCandidateNode(nodeId));
+        for (let i = 0; i < candidateIds.length; i++) {
+            processCandidateNode(candidateIds[i]);
         }
 
         return selectedIds;
@@ -2329,19 +2266,28 @@ window.MindMapInteractions = (function () {
         });
     }
 
-    function getCssFallbackCandidateIds(module, worldPoint) {
+    function getCssFallbackCandidateIds(module, worldPoint, context = null) {
         if (!module?.nodeObjectsById) {
             return [];
         }
 
-        const candidateIds = worldPoint
-            ? getHitTestCandidateNodeIds(module, worldPoint, { visibleOnly: false })
-            : [];
-        if (Array.isArray(candidateIds) && candidateIds.length > 0) {
+        if (context?.candidateIds !== undefined) return context.candidateIds;
+        const candidateIds = worldPoint ? getHitTestCandidateNodeIds(module, worldPoint, { visibleOnly: false }) : [];
+        if (Array.isArray(candidateIds)) {
+            if (context) {
+                context.candidateIds = candidateIds;
+                context.candidateSource = module._lastHitTestCandidateSource || 'spatial-grid';
+            }
             return candidateIds;
         }
 
-        return Array.from(module.nodeObjectsById.keys());
+        const fallbackIds = window.MindMapCss3dHotPath?.getBoundedFallbackIds?.(module) || [];
+        window.MindMapCss3dHotPath?.recordHitCandidates?.(module, 'bounded-fallback', fallbackIds.length);
+        if (context) {
+            context.candidateIds = fallbackIds;
+            context.candidateSource = 'bounded-fallback';
+        }
+        return fallbackIds;
     }
     // ▲▲▲ [New] ▲▲▲
 
@@ -2954,7 +2900,8 @@ window.MindMapInteractions = (function () {
         }
 
         const nodeId = getTargetNodeId(target);
-        if (nodeId && event && isOutOfFrameNodeDomHit(module, nodeId, event.clientX, event.clientY)) {
+        if (nodeId && event && isOutOfFrameNodeDomHit(
+            module, nodeId, event.clientX, event.clientY, getPointerHitContext(module, event))) {
             return false;
         }
 
@@ -2964,22 +2911,45 @@ window.MindMapInteractions = (function () {
     function getGuardedTargetNodeId(module, target, event) {
         const nodeId = getTargetNodeId(target);
         if (!nodeId || !event) {
-            const topCssHit = event
-                ? findCssNodeHitAtClientPoint(module, event.clientX, event.clientY)
-                : null;
+            const topCssHit = event ? getPointerCssHit(module, event) : null;
             return topCssHit?.nodeId || nodeId;
         }
-
-        const topCssHit = findCssNodeHitAtClientPoint(module, event.clientX, event.clientY);
-        if (topCssHit?.nodeId && topCssHit.nodeId !== nodeId) {
-            return topCssHit.nodeId;
+        const context = getPointerHitContext(module, event);
+        if (nodeId && !isOutOfFrameNodeDomHit(module, nodeId, event.clientX, event.clientY, context)) {
+            const entry = module.nodeObjectsById?.get?.(nodeId) || null;
+            if (entry) {
+                context.cssHit = {
+                    nodeId,
+                    entry,
+                    priority: getEntryInteractionPriority(module, entry, nodeId)
+                };
+            }
+            return nodeId;
         }
-
-        return isOutOfFrameNodeDomHit(module, nodeId, event.clientX, event.clientY)
-            ? null
-            : nodeId;
+        const topCssHit = getPointerCssHit(module, event);
+        return topCssHit?.nodeId || null;
+    }
+    function getPointerHitContext(module, event) {
+        if (!event || !module) return null;
+        let context = pointerHitContexts.get(event);
+        if (!context || context.module !== module) {
+            context = window.MindMapCss3dHotPath.createPointerHitContext(
+                module,
+                event,
+                getCachedViewportMetrics(module)
+            );
+            pointerHitContexts.set(event, context);
+        }
+        return context;
+    }
+    function getPointerCssHit(module, event) {
+        const context = getPointerHitContext(module, event);
+        if (!context) return null;
+        if (context.cssHit === undefined) {
+            context.cssHit = findCssNodeHitAtClientPoint(module, event.clientX, event.clientY, context);
+        }
+        return context.cssHit;
     }
-
     function getMountedEmbedCanvasDragTarget(module, target, event) {
         if (!module || !(target instanceof Element)) {
             return null;
@@ -3009,7 +2979,8 @@ window.MindMapInteractions = (function () {
             return null;
         }
 
-        if (event && !isClientPointInsideNodeFrame(module, nodeEntry, event.clientX, event.clientY, 3)) {
+        if (event && !isClientPointInsideNodeFrame(
+            module, nodeEntry, event.clientX, event.clientY, 3, getPointerHitContext(module, event), nodeId)) {
             return null;
         }
 
@@ -3364,26 +3335,25 @@ window.MindMapInteractions = (function () {
             return;
         }
 
-        const selectedIds = new Set();
-        if (module.selectedNodeIdJs) {
-            selectedIds.add(String(module.selectedNodeIdJs));
-        }
+        const selectedIds = new Set(module.selectedNodeIdJs ? [String(module.selectedNodeIdJs)] : []);
         module.multiSelectedNodeIds?.forEach?.(id => selectedIds.add(String(id)));
 
-        module.nodeObjectsById.forEach((entry, nodeId) => {
-            const contentType = String(entry?.model?.contentType ?? entry?.model?.ContentType ?? '').toLowerCase();
-            if (contentType !== 'embed' || !entry?.cssObject?.element) {
-                return;
-            }
+        const previousIds = module._embedInteractivityNodeIds instanceof Set ? module._embedInteractivityNodeIds : new Set();
+        if (previousIds.size === selectedIds.size && [...selectedIds].every(id => previousIds.has(id))) return;
 
-            const isSelected = selectedIds.has(String(nodeId || entry?.model?.id || entry?.model?.Id || ''));
+        const changedIds = new Set([...previousIds, ...selectedIds]);
+        window.MindMapCss3dHotPath?.increment?.(module, 'selection', 'nodesVisited', changedIds.size);
+        changedIds.forEach(nodeId => {
+            const entry = module.nodeObjectsById.get(nodeId);
+            if (String(entry?.model?.contentType ?? entry?.model?.ContentType ?? '').toLowerCase() !== 'embed' || !entry?.cssObject?.element) return;
+            const isSelected = selectedIds.has(nodeId);
             window.MindMapCss3DManager.syncCss3dEmbedInteractivity(entry.cssObject.element, {
                 isInteractive: isSelected,
                 isSelected
             });
         });
+        module._embedInteractivityNodeIds = selectedIds;
     }
-
     function switchPreviousSelectedNoteToWebGL(module, respectHighMode = true) {
         if (!module?.selectedNodeIdJs) return;
         const prevEntry = module.nodeObjectsById?.get(module.selectedNodeIdJs);
@@ -4235,7 +4205,6 @@ window.MindMapInteractions = (function () {
         }
 
         // ▼▼▼ [Debug] Click timing measurement ▼▼▼
-        const clickT0 = performance.now();
         // ▲▲▲ [Debug] ▲▲▲
 
         updatePointer(module, e);
@@ -4245,43 +4214,28 @@ window.MindMapInteractions = (function () {
         const meshesToIntersect = [];
 
         // ▼▼▼ [Debug] ▼▼▼
-        const clickT1 = performance.now();
-        let gridCellsChecked = 0;
-        let nodesChecked = 0;
         let residentLodHit = null;
         // ▲▲▲ [Debug] ▲▲▲
 
         if (module.raycaster.ray.intersectPlane(module.plane, module.intersectPoint)) {
             const nearby = getNearbyMeshes(module, module.intersectPoint);
             meshesToIntersect.push(...nearby);
+            meshesToIntersect._hitTestCandidatesAvailable = nearby._hitTestCandidatesAvailable === true;
 
             // ▼▼▼ [Fix] Fallback: spatial grid가 비어있으면 전체 노드 검색 ▼▼▼
-            if (meshesToIntersect.length === 0 && module.nodeObjectsById.size > 0) {
-                console.log('[onMouseDown] Spatial grid empty, falling back to all nodes');
-                module.nodeObjectsById.forEach((entry) => {
-                    const glObject = entry?.glObject;
-                    if (!glObject) {
-                        return;
-                    }
-
-                    if (glObject.isMesh || (Array.isArray(glObject.children) && glObject.children.length > 0)) {
-                        meshesToIntersect.push(glObject);
-                    }
-                });
+            if (meshesToIntersect.length === 0 && meshesToIntersect._hitTestCandidatesAvailable !== true && module.nodeObjectsById.size > 0) {
+                appendFallbackMeshes(module, module.intersectPoint, meshesToIntersect);
                 residentLodHit = module.lodRenderer?.pickResidentNodeAtWorldPoint?.(module.intersectPoint) || null;
             }
             // ▲▲▲ [Fix] ▲▲▲
         }
 
         // ▼▼▼ [Debug] ▼▼▼
-        const clickT2 = performance.now();
         // ▲▲▲ [Debug] ▲▲▲
 
         const intersects = module.raycaster.intersectObjects(meshesToIntersect, true);
 
         // ▼▼▼ [Debug] ▼▼▼
-        const clickT3 = performance.now();
-        console.log(`[Click Timing] setup=${(clickT1 - clickT0).toFixed(2)}ms | grid(${gridCellsChecked}cells, ${nodesChecked}nodes, ${meshesToIntersect.length}meshes)=${(clickT2 - clickT1).toFixed(2)}ms | raycast=${(clickT3 - clickT2).toFixed(2)}ms | TOTAL=${(clickT3 - clickT0).toFixed(2)}ms`);
         // ▲▲▲ [Debug] ▲▲▲
 
         const topIntersect = getTopIntersectionHit(module, intersects);
@@ -4289,7 +4243,7 @@ window.MindMapInteractions = (function () {
         const topIntersectPriority = topIntersect
             ? getIntersectionInteractionPriority(module, topIntersect)
             : -Infinity;
-        const cssFallbackHit = findCssNodeHitAtClientPoint(module, e.clientX, e.clientY);
+        const cssFallbackHit = getPointerCssHit(module, e);
         const cssFallbackPriority = cssFallbackHit?.priority ?? -Infinity;
         const shouldPreferCssFallback =
             !!cssFallbackHit?.nodeId &&
@@ -4308,15 +4262,6 @@ window.MindMapInteractions = (function () {
         if (topIntersect && !shouldPreferCssFallback) {
             let clickedMesh = topIntersect.object;
 
-            // ▼▼▼ [Debug] Raycast Hit Log ▼▼▼
-            console.log('[onMouseDown] Raycast Hits:', intersects.map(i => ({
-                name: i.object.name,
-                type: i.object.type,
-                nodeId: i.object.userData?.nodeId || i.object.parent?.userData?.nodeId,
-                distance: i.distance.toFixed(2),
-                visible: i.object.visible, // 추가 확인
-                parentVisible: i.object.parent?.visible // 부모 가시성 확인
-            })));
             // ▲▲▲ [Debug] ▲▲▲
 
             // ▼▼▼ [FIX] 클릭된 대상이 'body'(히트박스)라면 부모 그룹을 선택하도록 강제 보정 ▼▼▼