@mindexec/cli 0.2.477 → 0.2.478

package/wwwroot/_content/MindExecution.Shared/js/mind-map-dnd.js.bak

@@ -1,434 +0,0 @@
-// 파일 이름: mind-map-dnd.js
-// MindMap 드래그 앤 드롭 처리 (플러그인 레지스트리 기반 + 브라우저 이미지 드래그 강화)
-window.MindMapDnD = (function () {
-
-    if (!window.MindMapFileRegistry) {
-        window.MindMapFileRegistry = [];
-    }
-
-    function registerCoreHandlers() {
-        if (window.MindMapFileRegistry.some(h => h.name === 'CorePDF')) return;
-        
-        window.MindMapFileRegistry.push({
-            name: 'CorePDF',
-            priority: 5,
-            check: (file) => file.type === 'application/pdf',
-            getType: () => 'pdf'
-        });
-        console.log('[MindMapDnD] Core file handlers registered');
-    }
-    registerCoreHandlers();
-
- const eventHandlers = new WeakMap();
- const GRID_SNAP = 10;
-
- function getBoundHandlers(module) {
- if (!eventHandlers.has(module)) {
- eventHandlers.set(module, {
- boundOnDragOver: onDragOver.bind(null, module),
- boundOnDragLeave: onDragLeave.bind(null, module),
- boundOnDrop: onDrop.bind(null, module)
- });
- }
- return eventHandlers.get(module);
- }
-
- function onDragOver(module, e) {
- e.preventDefault();
- e.stopPropagation();
- e.dataTransfer.dropEffect = 'copy';
-    return false;
-    }
-
-    async function handleBrowserImageDrop(module, e, imageUrl) {
-        const mouse = {
-            x: (e.clientX / module.container.clientWidth) * 2 - 1,
-            y: -(e.clientY / module.container.clientHeight) * 2 + 1
-        };
-        const vfov = (module.camera.fov * Math.PI) / 180;
-        const viewHeight = 2 * Math.tan(vfov / 2) * module.camera.position.z;
-        const viewWidth = viewHeight * module.camera.aspect;
-        const worldX = module.camera.position.x + (mouse.x * viewWidth) / 2;
-        const worldY = module.camera.position.y + (mouse.y * viewHeight) / 2;
-
-        const tempId = `temp_browser_${Date.now()}`;
-        const placeholderNode = {
-            TempId: tempId,
-            ContentType: 'image',
-            FileName: 'Web Image',
-            X: module.snapToGrid(worldX),
-            Y: module.snapToGrid(worldY),
-            Width: 300,
-            Height: 200,
-            IsLoading: true
-        };
-
-        try {
-            const actualNodeIdsMap = await module.dotNetHelper.invokeMethodAsync('AddFileNodesFromJs', [placeholderNode]);
-            const actualId = actualNodeIdsMap[tempId];
-            if (!actualId) return;
-
-            const finalUrl = await fetchImageAsBlobUrl(imageUrl);
-
-            const { width, height } = await new Promise((resolve) => {
-                const img = new Image();
-                img.crossOrigin = 'anonymous';
-                img.onload = () => {
-                    const TARGET_WIDTH = 400;
-                    const aspectRatio = (img.naturalHeight > 0 && img.naturalWidth > 0)
-                        ? img.naturalHeight / img.naturalWidth
-                        : 0.75;
-                    const targetHeight = TARGET_WIDTH * aspectRatio;
-                    resolve({
-                        width: Math.round(TARGET_WIDTH / GRID_SNAP) * GRID_SNAP,
-                        height: Math.round(targetHeight / GRID_SNAP) * GRID_SNAP
-                    });
-                };
-                img.onerror = () => {
-                    console.warn('[MindMapDnD] Failed to measure browser image size.');
-                    resolve({ width: 300, height: 200 });
-                };
-                img.src = finalUrl;
-            });
-
-            await module.dotNetHelper.invokeMethodAsync('UpdateMultipleFileNodeDetails', [{
-                NodeId: actualId,
-                FileUrl: finalUrl,
-                Width: width,
-                Height: height
-            }]);
-
-            console.log('[MindMapDnD] Browser image dropped and processed successfully.');
-        } catch (err) {
-            console.error('[MindMapDnD] Failed to process browser image drop:', err);
-        }
-    }
-
-    function onDragLeave(module, e) {
-        e.preventDefault();
-        e.stopPropagation();
-    }
-
-    function extractImageUrl(dataTransfer) {
-        if (!dataTransfer) return null;
-        const html = dataTransfer.getData('text/html');
-        if (html) {
-            const parser = new DOMParser();
-            const doc = parser.parseFromString(html, 'text/html');
-            const img = doc.querySelector('img');
-            if (img && img.src) return img.src;
-        }
-        const uri = dataTransfer.getData('text/uri-list');
-        if (uri && /\.(jpg|jpeg|png|gif|webp)$/i.test(uri)) {
-            return uri;
-        }
-        return null;
-    }
-
-    async function fetchImageAsBlobUrl(url) {
-        try {
-            const response = await fetch(url, { mode: 'cors' });
-            if (!response.ok) throw new Error('Network response was not ok');
-            const blob = await response.blob();
-            return URL.createObjectURL(blob);
-        } catch (e) {
-            console.warn('[MindMapDnD] CORS fetch failed, using raw URL. (Canvas tainting may occur)', e);
-            return url;
-        }
-    }
-
-    async function onDrop(module, e) {
-        e.preventDefault();
-        e.stopPropagation();
-        if (!module.dotNetHelper) return false;
-
-        const dataTransfer = e.dataTransfer;
-        if (!dataTransfer) return false;
-
-        dataTransfer.dropEffect = 'copy';
- 
- // ▼▼▼ [프로파일링] 전체 프로세스 시간 측정 시작 ▼▼▼
- console.time('[DnD] Total Drop Process');
- // ▲▲▲ [프로파일링] ▲▲▲
-
-        const files = e.dataTransfer?.files ? Array.from(e.dataTransfer.files) : [];
-
-        if (files.length === 0) {
-            const imageUrl = extractImageUrl(e.dataTransfer);
-            if (imageUrl) {
-                console.log(`[MindMapDnD] Detected browser image drop: ${imageUrl}`);
-                await handleBrowserImageDrop(module, e, imageUrl);
-                return false;
-            }
-        }
-
-        // ▼▼▼ [수정] 레지스트리 기반 파일 필터링 ▼▼▼
- const filesToProcess = [];
-
- for (const file of files) {
-     let matchedType = null;
-
-     // 레지스트리 정렬 (priority 낮을수록 먼저)
-     const sortedRegistry = [...window.MindMapFileRegistry].sort((a, b) => 
-         (a.priority ?? 50) - (b.priority ?? 50)
-     );
-
-     // 등록된 핸들러들을 순회하며 매치되는 첫 번째 타입 사용
-     for (const handler of sortedRegistry) {
-         if (handler.check(file)) {
-             matchedType = handler.getType(file);
-             console.log(`[MindMapDnD] File '${file.name}' matched handler '${handler.name}' -> type: '${matchedType}'`);
-             break;
-         }
-     }
-
-     if (matchedType) {
-         filesToProcess.push({ file, type: matchedType });
-     } else {
-         console.warn(`[MindMapDnD] File '${file.name}' - no handler found, skipping`);
-     }
- }
-
- if (filesToProcess.length === 0) {
-     console.log('[MindMapDnD] No files matched any handler');
-     return false;
- }
- // ▲▲▲ [수정] ▲▲▲
-
- // 드롭 위치의 월드 좌표 계산
- const mouse = {
- x: (e.clientX / module.container.clientWidth) * 2 - 1,
- y: -(e.clientY / module.container.clientHeight) * 2 + 1
- };
- const vfov = (module.camera.fov * Math.PI) / 180;
- const viewHeight = 2 * Math.tan(vfov / 2) * module.camera.position.z;
- const viewWidth = viewHeight * module.camera.aspect;
- const worldX = module.camera.position.x + (mouse.x * viewWidth) / 2;
- const worldY = module.camera.position.y + (mouse.y * viewHeight) / 2;
-
- // ▼▼▼ [수정] 플레이스홀더 생성 (타입별 크기) ▼▼▼
- const placeholderNodes = filesToProcess.map(({ file, type }, index) => {
-     const tempId = `temp_${Date.now()}_${index}`;
-     
-     // 타입별 기본 크기 설정
-     let nodeWidth, nodeHeight;
-     switch (type) {
-         case 'image':
-             nodeWidth = 300;
-             nodeHeight = 200;
-             break;
-         case 'pdf':
-             nodeWidth = 400;
-             nodeHeight = 56;
-             break;
-         case 'text':
-             nodeWidth = 500;
-             nodeHeight = 300;
-             break;
-         case 'directory':
-             nodeWidth = 400;
-             nodeHeight = 200;
-             break;
-         default:
-             nodeWidth = 400;
-             nodeHeight = 200;
-     }
-
-     return {
-         TempId: tempId,
-         ContentType: type,
-         FileName: file.name,
-         X: module.snapToGrid(worldX + index * 20),
-         Y: module.snapToGrid(worldY - index * 20),
-         Width: nodeWidth,
-         Height: nodeHeight,
-         IsLoading: true
-     };
- });
- // ▲▲▲ [수정] ▲▲▲
-
- // ▼▼▼ [프로파일링] C# AddFileNodesFromJs 시간 측정 ▼▼▼
- console.time('[DnD] 1. C# AddFileNodesFromJs');
- // ▲▲▲ [프로파일링] ▲▲▲
- const actualNodeIdsMap = await module.dotNetHelper.invokeMethodAsync('AddFileNodesFromJs', placeholderNodes);
- // ▼▼▼ [프로파일링] ▼▼▼
- console.timeEnd('[DnD] 1. C# AddFileNodesFromJs');
- // ▲▲▲ [프로파일링] ▲▲▲
-
- (async () => {
- // ▼▼▼ [프로파일링] 병렬 파일 처리 시간 측정 ▼▼▼
- console.time('[DnD] 2. Parallel File Processing (All)');
- // ▲▲▲ [프로파일링] ▲▲▲
- 
- // ▼▼▼ [수정] 타입별 파일 처리 로직 ▼▼▼
- const processingPromises = filesToProcess.map(async ({ file, type }, i) => {
- const placeholder = placeholderNodes[i];
- const actualId = actualNodeIdsMap[placeholder.TempId];
- if (!actualId) return null;
-
- const objectUrl = URL.createObjectURL(file);
-
- switch (type) {
-     case 'image': {
-         console.time(`[DnD] 2a. Get Image Size - ${placeholder.FileName}`);
-         try {
-             const { width, height } = await new Promise((resolve, reject) => {
-                 const img = new Image();
-                 img.onload = () => {
-                     const TARGET_WIDTH = 400;
-                     const aspectRatio = (img.naturalHeight > 0 && img.naturalWidth > 0)
-                         ? img.naturalHeight / img.naturalWidth
-                         : 0.75;
-                     const targetHeight = TARGET_WIDTH * aspectRatio;
-                     resolve({
-                         width: Math.round(TARGET_WIDTH / GRID_SNAP) * GRID_SNAP,
-                         height: Math.round(targetHeight / GRID_SNAP) * GRID_SNAP
-                     });
-                 };
-                 img.onerror = reject;
-                 img.src = objectUrl;
-             });
-             console.timeEnd(`[DnD] 2a. Get Image Size - ${placeholder.FileName}`);
-             return {
-                 NodeId: actualId,
-                 FileUrl: objectUrl,
-                 Width: width,
-                 Height: height
-             };
-         } catch (err) {
-             console.timeEnd(`[DnD] 2a. Get Image Size - ${placeholder.FileName}`);
-             console.warn(`[DnD] Image load failed - ${placeholder.FileName}:`, err);
-             return {
-                 NodeId: actualId,
-                 FileUrl: '',
-                 Width: 300,
-                 Height: 200
-             };
-         }
-     }
-     case 'text': {
-         console.time(`[DnD] 2b. Read Text File - ${placeholder.FileName}`);
-         try {
-             // ▼▼▼ [디버깅] 파일 읽기 시작 ▼▼▼
-             console.log(`[DnD] Starting to read text file: ${placeholder.FileName}, actualId: ${actualId}`);
-             // ▲▲▲ [디버깅] ▲▲▲
-             
-             const textContent = await file.text();
-             
-             console.timeEnd(`[DnD] 2b. Read Text File - ${placeholder.FileName}`);
-             
-             // ▼▼▼ [디버깅] 파일 읽기 성공 ▼▼▼
-             console.log(`[DnD] Successfully read ${textContent.length} chars from ${placeholder.FileName}`);
-             // ▲▲▲ [디버깅] ▲▲▲
-             
-             // ▼▼▼ [디버깅] C# 메서드 호출 직전 ▼▼▼
-             console.log(`[DnD] About to call UpdateNodeContent with nodeId: ${actualId}, contentLength: ${textContent.length}`);
-             // ▲▲▲ [디버깅] ▲▲▲
-             
-             // 텍스트는 별도로 업데이트 (URL 대신 내용 저장)
-             await module.dotNetHelper.invokeMethodAsync('UpdateNodeContent', actualId, textContent);
-             
-             // ▼▼▼ [디버깅] C# 메서드 호출 성공 ▼▼▼
-             console.log(`[DnD] UpdateNodeContent completed for nodeId: ${actualId}`);
-             // ▲▲▲ [디버깅] ▲▲▲
-             
-             // ▼▼▼ [핵심 수정] 화면 갱신 요청 추가 ▼▼▼
-             // 이 줄이 없어서 텍스처가 '로딩 중' 상태에서 멈춰 있었습니다.
-             if (window.mindMap) {
-                 // 로컬 3D 뷰어에게 "이 노드 내용이 바뀌었으니 다시 그려라"고 명령
-                 await window.mindMap.updateNodeContent(actualId, textContent);
-                 console.log(`[DnD] Triggered local view update for node ${actualId}`);
-             }
-             // ▲▲▲ [핵심 수정] ▲▲▲
-             
-             return null; // 배치 업데이트에서 제외
-         } catch (err) {
-             console.timeEnd(`[DnD] 2b. Read Text File - ${placeholder.FileName}`);
-             // ▼▼▼ [디버깅] 오류 상세 로그 ▼▼▼
-             console.error(`[DnD] Text processing FAILED for ${placeholder.FileName}:`, err);
-             console.error(`[DnD] Error Details:`, {
-                 name: err.name,
-                 message: err.message,
-                 stack: err.stack
-             });
-             // ▲▲▲ [디버깅] ▲▲▲
-             return null;
-         }
-     }
-     case 'pdf':
-     default: {
-         return {
-             NodeId: actualId,
-             FileUrl: objectUrl,
-             Width: 400,
-             Height: 56
-         };
-     }
- }
- });
- // ▲▲▲ [수정] ▲▲▲
-
- const results = await Promise.allSettled(processingPromises);
- // ▼▼▼ [프로파일링] ▼▼▼
- console.timeEnd('[DnD] 2. Parallel File Processing (All)');
- // ▲▲▲ [프로파일링] ▲▲▲
- 
- const successfulUpdates = results
- .filter(res => res.status === 'fulfilled' && res.value !== null)
- .map(res => res.value);
- 
- const failedCount = results.filter(res => res.status === 'rejected' || res.value === null).length;
- console.log(`[MindMapDnD] File processing completed: ${successfulUpdates.length} succeeded, ${failedCount} failed.`);
-
- if (successfulUpdates.length > 0) {
- // ▼▼▼ [프로파일링] C# 일괄 업데이트 시간 측정 ▼▼▼
- console.time('[DnD] 3. C# UpdateMultipleFileNodeDetails');
- // ▲▲▲ [프로파일링] ▲▲▲
- try {
- await module.dotNetHelper.invokeMethodAsync('UpdateMultipleFileNodeDetails', successfulUpdates);
- // ▼▼▼ [프로파일링] ▼▼▼
- console.timeEnd('[DnD] 3. C# UpdateMultipleFileNodeDetails');
- console.log(`[MindMapDnD] Batch update sent to C#: ${successfulUpdates.length} nodes.`);
- // ▲▲▲ [프로파일링] ▲▲▲
- } catch (error) {
- // ▼▼▼ [프로파일링] ▼▼▼
- console.timeEnd('[DnD] 3. C# UpdateMultipleFileNodeDetails');
- // ▲▲▲ [프로파일링] ▲▲▲
- console.error('[MindMapDnD] Batch update failed:', error);
- }
- }
- })();
-
- return false;
- }
-
- return {
- addEventListeners: function (moduleInstance) {
- const handlers = getBoundHandlers(moduleInstance);
- if (moduleInstance.cssRenderer && moduleInstance.cssRenderer.domElement) {
- moduleInstance.cssRenderer.domElement.addEventListener('dragover', handlers.boundOnDragOver);
- moduleInstance.cssRenderer.domElement.addEventListener('dragleave', handlers.boundOnDragLeave);
- moduleInstance.cssRenderer.domElement.addEventListener('drop', handlers.boundOnDrop);
- } else if (moduleInstance.renderer && moduleInstance.renderer.domElement) {
- moduleInstance.renderer.domElement.addEventListener('dragover', handlers.boundOnDragOver);
- moduleInstance.renderer.domElement.addEventListener('dragleave', handlers.boundOnDragLeave);
- moduleInstance.renderer.domElement.addEventListener('drop', handlers.boundOnDrop);
- }
- },
- removeEventListeners: function (moduleInstance) {
- const handlers = getBoundHandlers(moduleInstance);
- if (moduleInstance.cssRenderer && moduleInstance.cssRenderer.domElement) {
- moduleInstance.cssRenderer.domElement.removeEventListener('dragover', handlers.boundOnDragOver);
- moduleInstance.cssRenderer.domElement.removeEventListener('dragleave', handlers.boundOnDragLeave);
- moduleInstance.cssRenderer.domElement.removeEventListener('drop', handlers.boundOnDrop);
- } else if (moduleInstance.renderer && moduleInstance.renderer.domElement) {
- moduleInstance.renderer.domElement.removeEventListener('dragover', handlers.boundOnDragOver);
- moduleInstance.renderer.domElement.removeEventListener('dragleave', handlers.boundOnDragLeave);
- moduleInstance.renderer.domElement.removeEventListener('drop', handlers.boundOnDrop);
- }
- eventHandlers.delete(moduleInstance);
- }
- };
-})();
-
-console.log('✓ mind-map-dnd.js loaded (Registry-based, plugin-extensible).');