@mindexec/cli 0.2.340 → 0.2.342

package/wwwroot/_content/MindExecution.Shared/js/plan-master.js

@@ -1,788 +0,0 @@
-// File: X:\Dev@Work\MindExecution\wwwroot\js\plan-master.js
-// PlanAgent 3D graph agent surface (copied from code-master.js)
-(function () {
-    // Module instance storage
-    let moduleInstance = null;
-    let pendingSettings = null;
-
-    // PlanMaster module class (kept for backward compatibility)
-    class PlanMasterModule {
-        constructor() {
-            // --- 3D rendering state ---
-            this.scene = null;
-            this.camera = null;
-            this.renderer = null;
-            this.cssRenderer = null;
-
-            // --- Blazor and DOM references ---
-            this.dotNetHelper = null;
-            this.container = null;
-
-            // --- Animation state ---
-            this.animationFrameId = null;
-
-            // --- Node management ---
-            this.nodeContentTargets = {};
-            this.nodeElements = {};
-            this.nodeObjectsById = new Map();
-
-            // --- Interaction state ---
-            this.isPanning = false;
-            this.lastMousePos = { x: 0, y: 0 };
-            this.targetZ = null;
-            this.targetX = null;
-            this.targetY = null;
-            this.isDraggingNode = false;
-            this.draggedNodeObject = null;
-
-            // --- Optimization state ---
-            this.isOptimizationActive = false;
-
-            // --- Text update state ---
-            this.latestMarkdownById = new Map();
-            this.pendingTextUpdates = new Map();
-            this.isTextUpdateScheduled = false;
-            this.throttledParseFlags = new Map();
-
-            // --- Theme management ---
-            this.currentThemeName = null;
-            this.currentThemeObject = null;
-
-            // --- Grid snapping ---
-            this.GRID_SIZE = 5;
-
-            // --- Bound event handlers ---
-            this.boundOnMouseDown = this.onMouseDown.bind(this);
-            this.boundOnMouseMove = this.onMouseMove.bind(this);
-            this.boundOnMouseUp = this.onMouseUp.bind(this);
-            this.boundOnContainerClick = this.onContainerClick.bind(this);
-            this.boundOnKeyDown = this.onKeyDown.bind(this);
-            this.boundOnContextMenu = this.onContextMenu.bind(this);
-            this.boundOnWheel = this.onWheel.bind(this);
-            this.boundOnResize = this.onResize.bind(this);
-        }
-
-        // Grid snapping utils
-        snapToGrid(value) {
-            return Math.floor(value / this.GRID_SIZE) * this.GRID_SIZE;
-        }
-        snapToGridY(value) {
-            return Math.ceil(value / this.GRID_SIZE) * this.GRID_SIZE;
-        }
-
-        // Enable optimization
-        activateOptimization() {
-            if (!this.isOptimizationActive) {
-                this.isOptimizationActive = true;
-                try {
-                    this.container.querySelectorAll('.map-node-bubble').forEach(n => n.classList.add('optimizing-transform'));
-                } catch { }
-            }
-        }
-
-        // Disable optimization
-        deactivateOptimization() {
-            if (this.isOptimizationActive) {
-                this.isOptimizationActive = false;
-                try {
-                    this.container.querySelectorAll('.map-node-bubble').forEach(n => n.classList.remove('optimizing-transform'));
-                } catch { }
-            }
-        }
-
-        // Ensure THREE and CSS3D are loaded
-        ensureThree() {
-            const hasThree = typeof globalThis.THREE !== 'undefined';
-            const hasCSS3D = typeof globalThis.CSS3DRenderer !== 'undefined';
-            if (!hasThree) {
-                console.error('[plan-master.js] THREE not loaded');
-                return false;
-            }
-            if (!hasCSS3D) {
-                console.error('[plan-master.js] CSS3DRenderer not loaded');
-                return false;
-            }
-            return true;
-        }
-
-        resolveThemeNameFromGridType(gridType) {
-            const map = {
-                space3d: 'Space3D',
-                spirit: 'SpiritFlow',
-                default: 'XYGrid',
-                dot: 'SpatialGrid2D'
-            };
-            const key = String(gridType || 'dot').toLowerCase();
-            return map[key] || 'SpatialGrid2D';
-        }
-
-        resolveThemeFromGeneralSettings() {
-            try {
-                const raw = localStorage.getItem('GeneralSettings');
-                if (!raw) {
-                    return 'SpatialGrid2D';
-                }
-
-                const settings = JSON.parse(raw);
-                return this.resolveThemeNameFromGridType(settings?.gridType);
-            } catch {
-                return 'SpatialGrid2D';
-            }
-        }
-
-        applySettings(settings) {
-            if (!settings || typeof settings !== 'object') {
-                this.setBackgroundTheme(this.resolveThemeFromGeneralSettings());
-                return;
-            }
-
-            if (settings.gridType) {
-                this.setBackgroundTheme(this.resolveThemeNameFromGridType(settings.gridType));
-            } else {
-                this.setBackgroundTheme(this.resolveThemeFromGeneralSettings());
-            }
-        }
-
-        // --- Event handlers ---
-
-        onMouseDown(e) {
-            if (e.button === 1 || e.button === 2 || (e.button === 0 && e.ctrlKey)) {
-                this.isPanning = true;
-                this.lastMousePos = { x: e.clientX, y: e.clientY };
-                this.container.style.cursor = 'grabbing';
-                e.preventDefault();
-                this.activateOptimization();
-                window.addEventListener('mousemove', this.boundOnMouseMove);
-                window.addEventListener('mouseup', this.boundOnMouseUp);
-            }
-        }
-
-        onMouseMove(e) {
-            if (this.isDraggingNode && this.draggedNodeObject) {
-                const dx = e.clientX - this.lastMousePos.x;
-                const dy = e.clientY - this.lastMousePos.y;
-                this.lastMousePos = { x: e.clientX, y: e.clientY };
-                const moveFactor = this.camera.position.z / 1200;
-                this.draggedNodeObject.position.x += dx * moveFactor;
-                this.draggedNodeObject.position.y -= dy * moveFactor;
-                return;
-            }
-            if (!this.isPanning) return;
-            const dx2 = e.clientX - this.lastMousePos.x;
-            const dy2 = e.clientY - this.lastMousePos.y;
-            this.lastMousePos = { x: e.clientX, y: e.clientY };
-            const panFactor = 0.002 * this.camera.position.z;
-            this.targetX -= dx2 * panFactor;
-            this.targetY += dy2 * panFactor;
-        }
-
-        onMouseUp(e) {
-            if (this.isDraggingNode && this.draggedNodeObject) {
-                // Apply grid snapping after drag ends
-                this.draggedNodeObject.position.x = this.snapToGrid(this.draggedNodeObject.position.x);
-                this.draggedNodeObject.position.y = this.snapToGridY(this.draggedNodeObject.position.y);
-
-                const finalNodeId = this.draggedNodeObject.element?.dataset?.nodeId;
-                const finalPosition = this.draggedNodeObject.position;
-                if (finalNodeId && this.dotNetHelper) {
-                    this.dotNetHelper.invokeMethodAsync('UpdateNodePosition', finalNodeId, finalPosition.x, finalPosition.y);
-                }
-                this.isDraggingNode = false;
-                this.draggedNodeObject = null;
-                window.removeEventListener('mousemove', this.boundOnMouseMove);
-                window.removeEventListener('mouseup', this.boundOnMouseUp);
-            }
-            if (this.isPanning) {
-                this.isPanning = false;
-                this.container.style.cursor = 'default';
-                // Align camera position to grid after panning ends
-                this.targetX = this.snapToGrid(this.camera.position.x);
-                this.targetY = this.snapToGridY(this.camera.position.y);
-                window.removeEventListener('mousemove', this.boundOnMouseMove);
-                window.removeEventListener('mouseup', this.boundOnMouseUp);
-            }
-        }
-
-        onContainerClick(e) {
-            if (e.button === 0) {
-                if (!this.isPanning && !this.isDraggingNode) {
-                    if (this.dotNetHelper) {
-                        this.dotNetHelper.invokeMethodAsync('SelectNodeInBlazor', null);
-                    }
-
-                    // [Modified] Use blurElement helper to clear focus from text inputs
-                    if (document.activeElement && (document.activeElement.tagName === 'TEXTAREA' || document.activeElement.tagName === 'INPUT')) {
-                        // document.activeElement.blur(); // (old)
-                        window.blurElement(document.activeElement); // (new)
-                    }
-                }
-            }
-        }
-
-        onKeyDown(e) {
-            if (!this.dotNetHelper) return;
-            // Enter: move focus to the global textarea
-            if (e.key === 'Enter') {
-                const t = e.target;
-                const isInputFocused = t && (t.tagName === 'INPUT' || t.tagName === 'TEXTAREA' || t.tagName === 'SELECT' || t.isContentEditable);
-                if (!isInputFocused) {
-                    const textarea = document.getElementById('global-input-textarea');
-                    if (textarea) {
-                        textarea.focus();
-                        e.preventDefault();
-                        return;
-                    }
-                }
-                if (t && t.id === 'global-input-textarea' && !e.shiftKey) {
-                    return;
-                }
-            }
-            const target = e.target;
-            if (target) {
-                const tagName = target.tagName;
-                if (tagName === 'INPUT' || tagName === 'TEXTAREA' || tagName === 'SELECT' || target.isContentEditable) {
-                    return;
-                }
-            }
-            const panFactor = 0.002 * this.camera.position.z;
-            const moveAmount = 80 * panFactor;
-            let handled = false;
-            switch (e.key) {
-                case 'ArrowUp':
-                    this.camera.position.y += moveAmount;
-                    this.targetY += moveAmount;
-                    handled = true;
-                    break;
-                case 'ArrowDown':
-                    this.camera.position.y -= moveAmount;
-                    this.targetY -= moveAmount;
-                    handled = true;
-                    break;
-                case 'ArrowLeft':
-                    this.camera.position.x -= moveAmount;
-                    this.targetX -= moveAmount;
-                    handled = true;
-                    break;
-                case 'ArrowRight':
-                    this.camera.position.x += moveAmount;
-                    this.targetX += moveAmount;
-                    handled = true;
-                    break;
-                case 'Delete':
-                    if (this.dotNetHelper) {
-                        this.dotNetHelper.invokeMethodAsync('DeleteSelectedNodeFromJs');
-                    }
-                    handled = true;
-                    break;
-            }
-            if (handled) {
-                e.preventDefault();
-                this.activateOptimization();
-            }
-        }
-
-        onContextMenu(e) {
-            e.preventDefault();
-        }
-
-        onWheel(e) {
-            e.preventDefault();
-            this.activateOptimization();
-            const mouse = {
-                x: (e.clientX / this.container.clientWidth) * 2 - 1,
-                y: -(e.clientY / this.container.clientHeight) * 2 + 1
-            };
-            const vfov = (this.camera.fov * Math.PI) / 180;
-            const viewHeight = 2 * Math.tan(vfov / 2) * this.camera.position.z;
-            const viewWidth = viewHeight * this.camera.aspect;
-            const worldMouseX = this.camera.position.x + (mouse.x * viewWidth) / 2;
-            const worldMouseY = this.camera.position.y + (mouse.y * viewHeight) / 2;
-            const prevZ = this.camera.position.z;
-            const zoomSensitivity = 0.003;
-            const zoomAmount = e.deltaY * (this.camera.position.z * zoomSensitivity);
-            let newZ = this.camera.position.z + zoomAmount;
-            newZ = Math.max(200, Math.min(newZ, 6000));
-            const zoomRatio = newZ / prevZ;
-            this.camera.position.z = newZ;
-            this.targetZ = newZ;
-            const newX = worldMouseX - (worldMouseX - this.camera.position.x) * zoomRatio;
-            const newY = worldMouseY - (worldMouseY - this.camera.position.y) * zoomRatio;
-            this.camera.position.x = newX;
-            this.camera.position.y = newY;
-            this.targetX = newX;
-            this.targetY = newY;
-        }
-
-        onResize(e) {
-            if (!this.container || !this.renderer || !this.camera) return;
-            const width = this.container.clientWidth;
-            const height = this.container.clientHeight;
-            this.camera.aspect = width / height;
-            this.camera.updateProjectionMatrix();
-            this.renderer.setSize(width, height);
-            this.cssRenderer.setSize(width, height);
-        }
-
-        // --- Animation loop ---
-        animate() {
-            this.animationFrameId = requestAnimationFrame(() => this.animate());
-            const smoothingFactor = 0.25;
-            const dx = this.targetX - this.camera.position.x;
-            const dy = this.targetY - this.camera.position.y;
-            const dz = this.targetZ - this.camera.position.z;
-            const isCameraMoving = Math.abs(dx) > 0.01 || Math.abs(dy) > 0.01 || Math.abs(dz) > 0.01;
-            this.camera.position.x += dx * smoothingFactor;
-            this.camera.position.y += dy * smoothingFactor;
-            this.camera.position.z += dz * smoothingFactor;
-            if (this.isOptimizationActive && Math.abs(dx) < 0.1 && Math.abs(dy) < 0.1 && Math.abs(dz) < 0.1) {
-                this.deactivateOptimization();
-            }
-            if (this.currentThemeObject && typeof this.currentThemeObject.animate === 'function') {
-                const themeRunner = window.MindMapThemes?.runAnimationIfNeeded;
-                if (typeof themeRunner === 'function') {
-                    themeRunner(this.currentThemeName, this.currentThemeObject, this.camera, {
-                        isCameraMoving
-                    });
-                } else {
-                    this.currentThemeObject.animate(this.camera);
-                }
-            }
-            this.renderer.render(this.scene, this.camera);
-            this.cssRenderer.render(this.scene, this.camera);
-        }
-
-        // --- Text update processing ---
-        processPendingTextUpdates() {
-            this.isTextUpdateScheduled = false;
-            if (this.pendingTextUpdates.size === 0) return;
-            this.pendingTextUpdates.forEach((content, nodeId) => {
-                const elements = this.nodeElements[nodeId];
-                const contentEl = elements?.content || this.nodeContentTargets[nodeId];
-                if (!contentEl) return;
-                if (elements?.loading && elements.loading.style.display !== 'none') {
-                    elements.loading.style.display = 'none';
-                }
-                try {
-                    if (typeof marked !== 'undefined' && typeof marked.parse === 'function') {
-                        contentEl.innerHTML = marked.parse(content || '');
-                    } else {
-                        contentEl.textContent = content || '';
-                    }
-                } catch (e) {
-                    console.error('[plan-master.js] Markdown parsing error:', e);
-                    contentEl.textContent = content || '';
-                }
-            });
-            this.pendingTextUpdates.clear();
-        }
-
-        // --- Initialization ---
-        init(containerId, helper) {
-            // Re-activation logic
-            if (this.container) {
-                const target = document.getElementById(containerId);
-                if (target && this.renderer && this.cssRenderer) {
-                    // Remove canvases from previous parent
-                    try {
-                        if (this.renderer.domElement.parentElement) {
-                            this.renderer.domElement.parentElement.removeChild(this.renderer.domElement);
-                        }
-                        if (this.cssRenderer.domElement.parentElement) {
-                            this.cssRenderer.domElement.parentElement.removeChild(this.cssRenderer.domElement);
-                        }
-                    } catch { }
-
-                    // Attach canvases to the new container
-                    target.appendChild(this.renderer.domElement);
-                    target.appendChild(this.cssRenderer.domElement);
-
-                    // Update references
-                    this.container = target;
-                    this.dotNetHelper = helper;
-                    target.style.display = 'block';
-                    // Trigger resize handler
-                    this.onResize();
-                    // Restart animation loop if it was stopped
-                    if (!this.animationFrameId) {
-                        this.animate();
-                    }
-                    if (pendingSettings) {
-                        this.applySettings(pendingSettings);
-                    } else {
-                        this.applySettings({});
-                    }
-                    console.log(`[plan-master.js] Re-activated and animation loop resumed for container #${containerId}.`);
-                    return;
-                }
-            }
-
-            // First-time init
-            if (!this.ensureThree() || !window.MindMapThemes) {
-                console.error('[plan-master.js] init failed: THREE, CSS3DRenderer, or MindMapThemes not loaded.');
-                return;
-            }
-
-            this.dotNetHelper = helper;
-            this.container = document.getElementById(containerId);
-            if (!this.container) {
-                console.error('[plan-master.js] Container not found!');
-                return;
-            }
-
-            this.container.style.display = 'block';
-
-            const THREE = globalThis.THREE;
-            this.scene = new THREE.Scene();
-
-            // Camera setup
-            const NEAR = 0.1;
-            const FAR = 1e7;
-            this.camera = new THREE.PerspectiveCamera(50, this.container.clientWidth / this.container.clientHeight, NEAR, FAR);
-            const initialZ = 1200;
-            this.camera.position.z = initialZ;
-            this.targetZ = initialZ;
-            this.targetX = this.camera.position.x;
-            this.targetY = this.camera.position.y;
-
-            // WebGL renderer setup
-            this.renderer = new THREE.WebGLRenderer({ antialias: true, logarithmicDepthBuffer: true });
-            this.renderer.setSize(this.container.clientWidth, this.container.clientHeight);
-            this.renderer.setPixelRatio(window.devicePixelRatio || 1);
-            this.renderer.domElement.style.position = 'absolute';
-            this.renderer.domElement.style.top = 0;
-            this.renderer.domElement.style.left = 0;
-            this.renderer.domElement.style.zIndex = 0;
-            this.container.appendChild(this.renderer.domElement);
-
-            // CSS3D renderer setup
-            const CSS3DRendererCtor = globalThis.CSS3DRenderer;
-            this.cssRenderer = new CSS3DRendererCtor();
-            this.cssRenderer.setSize(this.container.clientWidth, this.container.clientHeight);
-            this.cssRenderer.domElement.style.position = 'absolute';
-            this.cssRenderer.domElement.style.top = 0;
-            this.cssRenderer.domElement.style.left = 0;
-            this.cssRenderer.domElement.style.zIndex = 1;
-            this.container.appendChild(this.cssRenderer.domElement);
-
-            // Background theme (sync with MindCanvas GeneralSettings)
-            if (pendingSettings) {
-                this.applySettings(pendingSettings);
-            } else {
-                this.applySettings({});
-            }
-
-            // Register event listeners
-            this.cssRenderer.domElement.addEventListener('mousedown', this.boundOnMouseDown);
-            this.cssRenderer.domElement.addEventListener('click', this.boundOnContainerClick);
-            this.cssRenderer.domElement.addEventListener('wheel', this.boundOnWheel, { passive: false });
-            this.cssRenderer.domElement.addEventListener('contextmenu', this.boundOnContextMenu);
-            window.addEventListener('resize', this.boundOnResize);
-            window.addEventListener('keydown', this.boundOnKeyDown);
-
-            // Start animation
-            this.animate();
-
-            console.log(`[plan-master.js] Initialized for container #${containerId}.`);
-        }
-
-        // --- Background theme ---
-        setBackgroundTheme(themeName) {
-            if (themeName === this.currentThemeName || !this.scene || !window.MindMapThemes) return;
-            const newTheme = window.MindMapThemes.getTheme(themeName);
-            if (!newTheme) {
-                console.warn(`[plan-master.js] Background theme '${themeName}' not found.`);
-                return;
-            }
-
-            // Dispose previous theme
-            if (this.currentThemeObject) {
-                const oldTheme = window.MindMapThemes.getTheme(this.currentThemeName);
-                try { oldTheme?.dispose(this.currentThemeObject); } catch { }
-                if (this.scene) this.scene.remove(this.currentThemeObject);
-            }
-
-            // Create and attach new theme
-            this.currentThemeObject = newTheme.create(this.scene, this.renderer);
-            if (this.currentThemeObject) this.scene.add(this.currentThemeObject);
-            this.currentThemeName = themeName;
-            console.log(`[plan-master.js] Background theme set to: ${themeName}`);
-        }
-
-        // --- Add node ---
-        addNode(nodeModel) {
-            if (this.nodeObjectsById.has(nodeModel.id)) {
-                return;
-            }
-
-            console.log(`[plan-master.js] addNode called for ID: ${nodeModel.id}`);
-            const el = document.getElementById(`node-${nodeModel.id}`);
-            if (!el) {
-                console.warn(`[plan-master.js] Element 'node-${nodeModel.id}' not found in DOM.`);
-                return;
-            }
-
-            const nodeContent = el.firstElementChild || el;
-            const nodeClone = nodeContent.cloneNode(true);
-            nodeClone.dataset.nodeId = nodeModel.id;
-            nodeClone.style.cursor = 'pointer';
-            nodeClone.style.transformOrigin = '0% 0%';
-
-            // [Fix] Ensure the DOM element size matches the logical node size
-            // This prevents mismatch between the visual area and the draggable area
-            if (nodeModel.width && nodeModel.width > 0) {
-                nodeClone.style.width = nodeModel.width + 'px';
-            }
-            // For text/markdown nodes, height is dynamic based on content.
-            // For fixed-height types (note, pdf, image), enforce the height.
-            if (nodeModel.contentType === 'text') {
-                nodeClone.style.height = 'auto';
-            } else if (nodeModel.height && nodeModel.height > 0) {
-                nodeClone.style.height = nodeModel.height + 'px';
-            }
-
-            const contentTarget = nodeClone.querySelector(`#node-response-${nodeModel.id}`);
-            if (contentTarget) {
-                this.nodeContentTargets[nodeModel.id] = contentTarget;
-            } else {
-                console.error(`[plan-master.js] Could not find content target for node ${nodeModel.id}.`);
-            }
-
-            const loadingTarget = nodeClone.querySelector(`#node-loading-${nodeModel.id}`);
-            const bubbleTarget = nodeClone.querySelector('.map-node-bubble');
-            this.nodeElements[nodeModel.id] = {
-                content: contentTarget || null,
-                loading: loadingTarget || null,
-                bubble: bubbleTarget || nodeClone
-            };
-
-            let clickStartTime = 0;
-            nodeClone.addEventListener('mousedown', (e) => {
-                if (e.button === 0) {
-                    e.stopPropagation();
-                    this.isDraggingNode = true;
-                    this.draggedNodeObject = obj;
-                    this.lastMousePos = { x: e.clientX, y: e.clientY };
-                    clickStartTime = Date.now();
-                    window.addEventListener('mousemove', this.boundOnMouseMove);
-                    window.addEventListener('mouseup', this.boundOnMouseUp);
-                }
-            });
-
-            nodeClone.addEventListener('click', (e) => {
-                e.stopPropagation();
-                if (Date.now() - clickStartTime < 200) {
-                    const nid = e.currentTarget.dataset.nodeId;
-                    if (nid && this.dotNetHelper) {
-                        this.dotNetHelper.invokeMethodAsync('SelectNodeInBlazor', nid);
-                    }
-                }
-            });
-
-            const CSS3DObjectCtor = globalThis.CSS3DObject || (globalThis.THREE && globalThis.THREE.CSS3DObject);
-            const obj = new CSS3DObjectCtor(nodeClone);
-            obj.position.set(nodeModel.positionX || 0, nodeModel.positionY || 0, 1);
-            this.scene.add(obj);
-            this.nodeObjectsById.set(nodeModel.id, obj);
-            console.log(`[plan-master.js] Node ${nodeModel.id} added to Three.js scene.`);
-        }
-
-        // --- Remove node ---
-        removeNode(nodeId) {
-            const obj = this.nodeObjectsById.get(nodeId);
-            if (obj) {
-                if (this.scene) this.scene.remove(obj);
-                this.nodeObjectsById.delete(nodeId);
-                delete this.nodeElements[nodeId];
-                delete this.nodeContentTargets[nodeId];
-                this.latestMarkdownById.delete(nodeId);
-                this.throttledParseFlags.delete(nodeId);
-                this.pendingTextUpdates.delete(nodeId);
-                console.log(`[plan-master.js] Node ${nodeId} removed from scene.`);
-            }
-        }
-
-        // --- Update node content ---
-        updateNodeContent(nodeId, markdownContent) {
-            const id = String(nodeId);
-            this.latestMarkdownById.set(id, markdownContent || '');
-            this.pendingTextUpdates.set(id, markdownContent || '');
-            if (!this.isTextUpdateScheduled) {
-                this.isTextUpdateScheduled = true;
-                requestAnimationFrame(() => {
-                    this.processPendingTextUpdates();
-                    this.isTextUpdateScheduled = false;
-                });
-            }
-        }
-
-        // --- Update node selection ---
-        updateNodeSelection(oldNodeId, newNodeId) {
-            if (oldNodeId) {
-                const oldElements = this.nodeElements[oldNodeId];
-                if (oldElements && oldElements.bubble) {
-                    oldElements.bubble.classList.remove('selected');
-                }
-            }
-            if (newNodeId) {
-                const newElements = this.nodeElements[newNodeId];
-                if (newElements && newElements.bubble) {
-                    newElements.bubble.classList.add('selected');
-                }
-            }
-        }
-
-        // --- Hide (tab switch) ---
-        hide() {
-            if (this.container) {
-                this.container.style.display = 'none';
-                // Stop animation loop
-                if (this.animationFrameId) {
-                    cancelAnimationFrame(this.animationFrameId);
-                    this.animationFrameId = null;
-                }
-                console.log('[plan-master.js] Hidden and animation loop paused.');
-            }
-        }
-
-        // --- Cleanup and dispose ---
-        cleanupAndDispose() {
-            if (!this.container) return;
-
-            // Stop animation loop
-            if (this.animationFrameId) {
-                cancelAnimationFrame(this.animationFrameId);
-                this.animationFrameId = null;
-            }
-
-            // Remove event listeners
-            if (this.cssRenderer && this.cssRenderer.domElement) {
-                this.cssRenderer.domElement.removeEventListener('mousedown', this.boundOnMouseDown);
-                this.cssRenderer.domElement.removeEventListener('click', this.boundOnContainerClick);
-                this.cssRenderer.domElement.removeEventListener('wheel', this.boundOnWheel);
-                this.cssRenderer.domElement.removeEventListener('contextmenu', this.boundOnContextMenu);
-            }
-            window.removeEventListener('mousemove', this.boundOnMouseMove);
-            window.removeEventListener('mouseup', this.boundOnMouseUp);
-            window.removeEventListener('resize', this.boundOnResize);
-            window.removeEventListener('keydown', this.boundOnKeyDown);
-
-            // Theme cleanup
-            if (this.currentThemeObject && window.MindMapThemes) {
-                const theme = window.MindMapThemes.getTheme(this.currentThemeName);
-                try { theme?.dispose(this.currentThemeObject); } catch { }
-                if (this.scene) this.scene.remove(this.currentThemeObject);
-            }
-            this.currentThemeObject = null;
-            this.currentThemeName = null;
-
-            // Reset state
-            try { this.pendingTextUpdates.clear(); } catch { }
-            try { this.throttledParseFlags.clear(); } catch { }
-            try { this.latestMarkdownById.clear(); } catch { }
-            this.nodeContentTargets = {};
-            this.nodeElements = {};
-            try { this.nodeObjectsById.clear(); } catch { }
-
-            // Dispose scene/renderer resources
-            if (this.scene) {
-                this.scene.traverse(object => {
-                    if (object.geometry) object.geometry.dispose();
-                    if (object.material) {
-                        if (Array.isArray(object.material)) {
-                            object.material.forEach(material => material.dispose());
-                        } else {
-                            object.material.dispose();
-                        }
-                    }
-                });
-            }
-            if (this.renderer) this.renderer.dispose();
-            if (this.cssRenderer && this.cssRenderer.domElement && this.cssRenderer.domElement.parentElement) {
-                this.cssRenderer.domElement.parentElement.removeChild(this.cssRenderer.domElement);
-            }
-
-            // Clear references
-            this.scene = null;
-            this.camera = null;
-            this.renderer = null;
-            this.cssRenderer = null;
-            this.container = null;
-            this.dotNetHelper = null;
-
-            console.log('[plan-master.js] Disposed all resources.');
-        }
-    }
-
-    // --- Public window.planMaster interface ---
-    window.planMaster = {
-        init: function (containerId, helper) {
-            if (!moduleInstance) {
-                moduleInstance = new PlanMasterModule();
-            }
-            moduleInstance.init(containerId, helper);
-        },
-        addNode: function (nodeModel) {
-            if (moduleInstance) moduleInstance.addNode(nodeModel);
-        },
-        removeNode: function (nodeId) {
-            if (moduleInstance) moduleInstance.removeNode(nodeId);
-        },
-        updateNodeContent: function (nodeId, markdownContent) {
-            if (moduleInstance) moduleInstance.updateNodeContent(nodeId, markdownContent);
-        },
-        updateNodeSelection: function (oldNodeId, newNodeId) {
-            if (moduleInstance) moduleInstance.updateNodeSelection(oldNodeId, newNodeId);
-        },
-        applySettings: function (settings) {
-            pendingSettings = Object.assign({}, pendingSettings || {}, settings || {});
-            if (moduleInstance) {
-                moduleInstance.applySettings(pendingSettings);
-            }
-        },
-        setBackgroundTheme: function (themeName) {
-            if (moduleInstance) moduleInstance.setBackgroundTheme(themeName);
-        },
-        hide: function () {
-            if (moduleInstance) moduleInstance.hide();
-        },
-        clearAllNodes: function () {
-            if (moduleInstance && moduleInstance.nodeObjectsById) {
-                // Remove all nodes from scene
-                moduleInstance.nodeObjectsById.forEach((obj, nodeId) => {
-                    if (moduleInstance.scene) {
-                        moduleInstance.scene.remove(obj);
-                    }
-                    // Cleanup textures if any
-                    if (obj.material) {
-                        if (obj.material.map) obj.material.map.dispose();
-                        obj.material.dispose();
-                    }
-                    if (obj.geometry) obj.geometry.dispose();
-                });
-                moduleInstance.nodeObjectsById.clear();
-
-                // Clear related caches
-                if (moduleInstance.nodeElements) moduleInstance.nodeElements = {};
-                if (moduleInstance.nodeContentTargets) moduleInstance.nodeContentTargets = {};
-                if (moduleInstance.latestMarkdownById) moduleInstance.latestMarkdownById.clear();
-                if (moduleInstance.throttledParseFlags) moduleInstance.throttledParseFlags.clear();
-                if (moduleInstance.pendingTextUpdates) moduleInstance.pendingTextUpdates.clear();
-
-                console.log('[planAgent] All nodes cleared');
-            }
-        },
-        cleanupAndDispose: function () {
-            if (moduleInstance) {
-                moduleInstance.cleanupAndDispose();
-                moduleInstance = null;
-            }
-            pendingSettings = null;
-        }
-    };
-
-    // Backward-compatible alias: PlanAgent is the new page/internal name.
-    window.planAgent = window.planMaster;
-
-    console.log('? plan-master.js loaded and ready (Copied from code-master.js).');
-})();
-