@2112-lab/central-plant 0.1.6 → 0.1.7

package/dist/cjs/src/core/sceneViewer.js

@@ -0,0 +1,824 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
+var THREE = require('three');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n["default"] = e;
+  return Object.freeze(n);
+}
+
+var THREE__namespace = /*#__PURE__*/_interopNamespace(THREE);
+
+var SceneViewer = /*#__PURE__*/function () {
+  /**
+   * Initialize the SceneViewer
+   * @param {HTMLElement} container - DOM element to render the scene
+   * @param {Object} options - Configuration options
+   * @param {Object} centralPlant - CentralPlant instance for managers
+   */
+  function SceneViewer(container) {
+    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    var centralPlant = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
+    _rollupPluginBabelHelpers.classCallCheck(this, SceneViewer);
+    // Core properties
+    this.container = container;
+    this.centralPlant = centralPlant;
+    this.options = _rollupPluginBabelHelpers.objectSpread2({
+      enableAutoRotation: false,
+      enableShadows: true,
+      enableBloom: true,
+      enableSSAO: false,
+      antialias: true,
+      pixelRatio: Math.min(window.devicePixelRatio, 2)
+    }, options);
+
+    // Instance tracking for hot-reload handling
+    this.instanceId = Date.now() + Math.random();
+
+    // Core Three.js objects
+    this.scene = null;
+    this.camera = null;
+    this.renderer = null;
+    this.controls = null;
+    this.composer = null;
+    this.bloomPass = null;
+    this.ssaoPass = null;
+
+    // Utilities
+    this.textureLoader = null;
+    this.gltfLoader = null;
+    this.envMap = null;
+    this.performanceMonitor = null;
+    this.resizeObserver = null;
+
+    // Scene data
+    this.currentSceneData = null;
+
+    // State flags
+    this.isDestroyed = false;
+    this.isInitialized = false;
+
+    // Transform controls
+    this.transformManager = null;
+    this.selectedObjectForTransform = null;
+    this.transformMode = 'translate';
+    this.transformSpace = 'world';
+    this.transformHistory = [];
+    this.previousTransformValues = null;
+
+    // Manager instances (will be attached from centralPlant)
+    this.managers = {};
+
+    // Event system for communication with external systems
+    this.eventCallbacks = new Map();
+
+    // Drag and drop state
+    this.isDragOver = false;
+    this.dragDropManager = null;
+
+    // Scene helper utility
+    this.sceneHelper = null;
+
+    // Pathfinder version cache
+    this.pathfinderVersionInfo = null;
+
+    // Transform settings
+    this.shouldUpdatePaths = true;
+
+    // Initialize the scene viewer
+    this.init();
+  }
+
+  /**
+   * Initialize the Three.js scene and all components
+   */
+  return _rollupPluginBabelHelpers.createClass(SceneViewer, [{
+    key: "init",
+    value: (function () {
+      var _init = _rollupPluginBabelHelpers.asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers.regenerator().m(function _callee() {
+        var _t;
+        return _rollupPluginBabelHelpers.regenerator().w(function (_context) {
+          while (1) switch (_context.n) {
+            case 0:
+              _context.p = 0;
+              console.log('🚀 Initializing SceneViewer...', {
+                instanceId: this.instanceId,
+                containerSize: {
+                  width: this.container.clientWidth,
+                  height: this.container.clientHeight
+                }
+              });
+
+              // Attach managers from centralPlant if available
+              if (this.centralPlant) {
+                this.attachManagers();
+              }
+
+              // Initialize Three.js components
+              this.initScene();
+              this.initCamera();
+              this.initRenderer();
+              this.initLights();
+              this.initControls();
+              this.initPostProcessing();
+              this.initEventListeners();
+
+              // Initialize managers that require scene to be ready
+              _context.n = 1;
+              return this.initializeSceneManagers();
+            case 1:
+              // Start the animation loop
+              this.animate();
+              this.isInitialized = true;
+              this.emit('initialized', {
+                sceneViewer: this
+              });
+              console.log('✅ SceneViewer initialization completed');
+              _context.n = 3;
+              break;
+            case 2:
+              _context.p = 2;
+              _t = _context.v;
+              console.error('❌ Error initializing SceneViewer:', _t);
+              this.emit('error', {
+                error: _t,
+                phase: 'initialization'
+              });
+            case 3:
+              return _context.a(2);
+          }
+        }, _callee, this, [[0, 2]]);
+      }));
+      function init() {
+        return _init.apply(this, arguments);
+      }
+      return init;
+    }()
+    /**
+     * Attach managers from centralPlant
+     */
+    )
+  }, {
+    key: "attachManagers",
+    value: function attachManagers() {
+      var _this = this;
+      if (!this.centralPlant) return;
+
+      // Get all managers from centralPlant
+      var managers = this.centralPlant.getAllManagers();
+
+      // Attach each manager to this instance
+      Object.entries(managers).forEach(function (_ref) {
+        var _ref2 = _rollupPluginBabelHelpers.slicedToArray(_ref, 2),
+          key = _ref2[0],
+          manager = _ref2[1];
+        _this[key] = manager;
+        _this.managers[key] = manager;
+      });
+
+      // Also attach utilities
+      var utilities = this.centralPlant.getAllUtilities();
+      Object.entries(utilities).forEach(function (_ref3) {
+        var _ref4 = _rollupPluginBabelHelpers.slicedToArray(_ref3, 2),
+          key = _ref4[0],
+          utility = _ref4[1];
+        _this[key] = utility;
+      });
+      console.log('📦 Managers attached to SceneViewer:', Object.keys(managers));
+    }
+
+    /**
+     * Initialize Three.js scene
+     */
+  }, {
+    key: "initScene",
+    value: function initScene() {
+      this.scene = new THREE__namespace.Scene();
+      this.scene.name = 'MainScene';
+
+      // Set background
+      this.scene.background = new THREE__namespace.Color(0x87CEEB); // Sky blue
+
+      console.log('🌍 Scene initialized');
+    }
+
+    /**
+     * Initialize camera
+     */
+  }, {
+    key: "initCamera",
+    value: function initCamera() {
+      var aspect = this.container.clientWidth / this.container.clientHeight;
+      this.camera = new THREE__namespace.PerspectiveCamera(75, aspect, 0.1, 1000);
+      this.camera.position.set(5, 5, 5);
+      this.camera.lookAt(0, 0, 0);
+      console.log('📷 Camera initialized');
+    }
+
+    /**
+     * Initialize renderer
+     */
+  }, {
+    key: "initRenderer",
+    value: function initRenderer() {
+      this.renderer = new THREE__namespace.WebGLRenderer({
+        antialias: this.options.antialias,
+        powerPreference: 'high-performance'
+      });
+      this.renderer.setSize(this.container.clientWidth, this.container.clientHeight);
+      this.renderer.setPixelRatio(this.options.pixelRatio);
+      this.renderer.shadowMap.enabled = this.options.enableShadows;
+      this.renderer.shadowMap.type = THREE__namespace.PCFSoftShadowMap;
+      this.renderer.outputColorSpace = THREE__namespace.SRGBColorSpace;
+      this.renderer.toneMapping = THREE__namespace.ACESFilmicToneMapping;
+      this.renderer.toneMappingExposure = 1;
+
+      // Append renderer to container
+      this.container.appendChild(this.renderer.domElement);
+      console.log('🎨 Renderer initialized');
+    }
+
+    /**
+     * Initialize lighting
+     */
+  }, {
+    key: "initLights",
+    value: function initLights() {
+      // Ambient light
+      var ambientLight = new THREE__namespace.AmbientLight(0x404040, 0.4);
+      this.scene.add(ambientLight);
+
+      // Directional light
+      var directionalLight = new THREE__namespace.DirectionalLight(0xffffff, 1);
+      directionalLight.position.set(10, 10, 5);
+      directionalLight.castShadow = this.options.enableShadows;
+      if (this.options.enableShadows) {
+        directionalLight.shadow.mapSize.width = 2048;
+        directionalLight.shadow.mapSize.height = 2048;
+        directionalLight.shadow.camera.near = 0.5;
+        directionalLight.shadow.camera.far = 500;
+      }
+      this.scene.add(directionalLight);
+      console.log('💡 Lights initialized');
+    }
+
+    /**
+     * Initialize controls (if available)
+     */
+  }, {
+    key: "initControls",
+    value: function initControls() {
+      // Controls will be initialized by the camera controls manager
+      // This is just a placeholder for the base setup
+      console.log('🎮 Controls setup ready');
+    }
+
+    /**
+     * Initialize post-processing effects
+     */
+  }, {
+    key: "initPostProcessing",
+    value: function initPostProcessing() {
+      // Post-processing will be handled by managers
+      // This is just a placeholder
+      console.log('✨ Post-processing setup ready');
+    }
+
+    /**
+     * Initialize event listeners
+     */
+  }, {
+    key: "initEventListeners",
+    value: function initEventListeners() {
+      var _this2 = this;
+      // Resize observer
+      this.resizeObserver = new ResizeObserver(function (entries) {
+        var _iterator = _rollupPluginBabelHelpers.createForOfIteratorHelper(entries),
+          _step;
+        try {
+          for (_iterator.s(); !(_step = _iterator.n()).done;) {
+            var entry = _step.value;
+            _this2.handleResize();
+          }
+        } catch (err) {
+          _iterator.e(err);
+        } finally {
+          _iterator.f();
+        }
+      });
+      this.resizeObserver.observe(this.container);
+
+      // Mouse events for selection
+      this.container.addEventListener('click', this.handleClick.bind(this));
+      this.container.addEventListener('dblclick', this.handleDoubleClick.bind(this));
+
+      // Drag and drop events
+      this.container.addEventListener('dragover', this.handleDragOver.bind(this));
+      this.container.addEventListener('drop', this.handleDrop.bind(this));
+      this.container.addEventListener('dragenter', this.handleDragEnter.bind(this));
+      this.container.addEventListener('dragleave', this.handleDragLeave.bind(this));
+      console.log('👂 Event listeners initialized');
+    }
+
+    /**
+     * Initialize scene managers that require the scene to be ready
+     */
+  }, {
+    key: "initializeSceneManagers",
+    value: (function () {
+      var _initializeSceneManagers = _rollupPluginBabelHelpers.asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers.regenerator().m(function _callee2() {
+        var _t2;
+        return _rollupPluginBabelHelpers.regenerator().w(function (_context2) {
+          while (1) switch (_context2.n) {
+            case 0:
+              _context2.p = 0;
+              if (!this.sceneInitializationManager) {
+                _context2.n = 1;
+                break;
+              }
+              _context2.n = 1;
+              return this.sceneInitializationManager.initializeScene();
+            case 1:
+              if (!this.environmentManager) {
+                _context2.n = 2;
+                break;
+              }
+              _context2.n = 2;
+              return this.environmentManager.initializeEnvironment();
+            case 2:
+              // Initialize other managers as needed
+              console.log('🏗️ Scene managers initialized');
+              _context2.n = 4;
+              break;
+            case 3:
+              _context2.p = 3;
+              _t2 = _context2.v;
+              console.error('❌ Error initializing scene managers:', _t2);
+            case 4:
+              return _context2.a(2);
+          }
+        }, _callee2, this, [[0, 3]]);
+      }));
+      function initializeSceneManagers() {
+        return _initializeSceneManagers.apply(this, arguments);
+      }
+      return initializeSceneManagers;
+    }()
+    /**
+     * Main animation loop
+     */
+    )
+  }, {
+    key: "animate",
+    value: function animate() {
+      var _this3 = this;
+      if (this.isDestroyed) return;
+      requestAnimationFrame(function () {
+        return _this3.animate();
+      });
+      try {
+        // Update controls
+        if (this.controls && this.controls.update) {
+          this.controls.update();
+        }
+
+        // Update camera controls manager
+        if (this.cameraControlsManager) {
+          this.cameraControlsManager.update();
+        }
+
+        // Update animation manager
+        if (this.animationManager) {
+          this.animationManager.update();
+        }
+
+        // Update performance monitor
+        if (this.performanceMonitor) {
+          this.performanceMonitor.begin();
+        }
+
+        // Render the scene
+        if (this.composer) {
+          this.composer.render();
+        } else {
+          this.renderer.render(this.scene, this.camera);
+        }
+
+        // End performance monitoring
+        if (this.performanceMonitor) {
+          this.performanceMonitor.end();
+        }
+      } catch (error) {
+        console.error('❌ Error in animation loop:', error);
+      }
+    }
+
+    /**
+     * Handle window/container resize
+     */
+  }, {
+    key: "handleResize",
+    value: function handleResize() {
+      if (!this.camera || !this.renderer) return;
+      var width = this.container.clientWidth;
+      var height = this.container.clientHeight;
+
+      // Update camera
+      this.camera.aspect = width / height;
+      this.camera.updateProjectionMatrix();
+
+      // Update renderer
+      this.renderer.setSize(width, height);
+
+      // Update composer if available
+      if (this.composer) {
+        this.composer.setSize(width, height);
+      }
+      this.emit('resize', {
+        width: width,
+        height: height
+      });
+    }
+
+    /**
+     * Handle click events
+     */
+  }, {
+    key: "handleClick",
+    value: function handleClick(event) {
+      if (!this.camera || !this.scene) return;
+      var rect = this.container.getBoundingClientRect();
+      var mouse = new THREE__namespace.Vector2();
+      mouse.x = (event.clientX - rect.left) / rect.width * 2 - 1;
+      mouse.y = -((event.clientY - rect.top) / rect.height) * 2 + 1;
+      var raycaster = new THREE__namespace.Raycaster();
+      raycaster.setFromCamera(mouse, this.camera);
+      var intersects = raycaster.intersectObjects(this.scene.children, true);
+      if (intersects.length > 0) {
+        var object = intersects[0].object;
+        this.selectObject(object);
+      } else {
+        this.selectObject(null);
+      }
+    }
+
+    /**
+     * Handle double click events
+     */
+  }, {
+    key: "handleDoubleClick",
+    value: function handleDoubleClick(event) {
+      // Handle double click actions
+      this.emit('doubleClick', {
+        event: event
+      });
+    }
+
+    /**
+     * Handle drag over events
+     */
+  }, {
+    key: "handleDragOver",
+    value: function handleDragOver(event) {
+      event.preventDefault();
+      this.isDragOver = true;
+      this.emit('dragOver', {
+        event: event
+      });
+    }
+
+    /**
+     * Handle drop events
+     */
+  }, {
+    key: "handleDrop",
+    value: function handleDrop(event) {
+      event.preventDefault();
+      this.isDragOver = false;
+      try {
+        var dataTransfer = event.dataTransfer.getData('text/plain');
+        if (dataTransfer) {
+          var componentData = JSON.parse(dataTransfer);
+
+          // Calculate drop position
+          var rect = this.container.getBoundingClientRect();
+          var mouse = new THREE__namespace.Vector2();
+          mouse.x = (event.clientX - rect.left) / rect.width * 2 - 1;
+          mouse.y = -((event.clientY - rect.top) / rect.height) * 2 + 1;
+          var raycaster = new THREE__namespace.Raycaster();
+          raycaster.setFromCamera(mouse, this.camera);
+
+          // Cast ray to ground plane (y = 0)
+          var groundPlane = new THREE__namespace.Plane(new THREE__namespace.Vector3(0, 1, 0), 0);
+          var dropPosition = new THREE__namespace.Vector3();
+          raycaster.ray.intersectPlane(groundPlane, dropPosition);
+          this.emit('componentDropped', {
+            componentData: componentData,
+            position: dropPosition,
+            event: event
+          });
+        }
+      } catch (error) {
+        console.error('❌ Error handling drop:', error);
+        this.emit('dropError', {
+          error: error,
+          event: event
+        });
+      }
+    }
+
+    /**
+     * Handle drag enter events
+     */
+  }, {
+    key: "handleDragEnter",
+    value: function handleDragEnter(event) {
+      event.preventDefault();
+      this.emit('dragEnter', {
+        event: event
+      });
+    }
+
+    /**
+     * Handle drag leave events
+     */
+  }, {
+    key: "handleDragLeave",
+    value: function handleDragLeave(event) {
+      this.isDragOver = false;
+      this.emit('dragLeave', {
+        event: event
+      });
+    }
+
+    /**
+     * Select an object in the scene
+     */
+  }, {
+    key: "selectObject",
+    value: function selectObject(object) {
+      // Clear previous selection
+      if (this.selectedObjectForTransform) {
+        // Remove selection indicators
+        this.clearObjectSelection(this.selectedObjectForTransform);
+      }
+      this.selectedObjectForTransform = object;
+      if (object) {
+        // Add selection indicators
+        this.highlightSelectedObject(object);
+
+        // Initialize transform controls if available
+        if (this.transformManager) {
+          this.transformManager.attachToObject(object);
+        }
+      } else {
+        // Clear transform controls
+        if (this.transformManager) {
+          this.transformManager.detach();
+        }
+      }
+      this.emit('objectSelected', {
+        object: object
+      });
+    }
+
+    /**
+     * Clear object selection visual indicators
+     */
+  }, {
+    key: "clearObjectSelection",
+    value: function clearObjectSelection(object) {
+      // Remove selection outline or other indicators
+      // This would depend on your specific selection visualization
+    }
+
+    /**
+     * Highlight selected object
+     */
+  }, {
+    key: "highlightSelectedObject",
+    value: function highlightSelectedObject(object) {
+      // Add selection outline or other indicators
+      // This would depend on your specific selection visualization
+    }
+
+    /**
+     * Load a scene from data
+     */
+  }, {
+    key: "loadScene",
+    value: (function () {
+      var _loadScene = _rollupPluginBabelHelpers.asyncToGenerator(/*#__PURE__*/_rollupPluginBabelHelpers.regenerator().m(function _callee3(sceneData) {
+        var _t3;
+        return _rollupPluginBabelHelpers.regenerator().w(function (_context3) {
+          while (1) switch (_context3.n) {
+            case 0:
+              _context3.p = 0;
+              this.currentSceneData = sceneData;
+              if (!this.componentManager) {
+                _context3.n = 1;
+                break;
+              }
+              _context3.n = 1;
+              return this.componentManager.loadSceneFromData(sceneData);
+            case 1:
+              this.emit('sceneLoaded', {
+                sceneData: sceneData
+              });
+              _context3.n = 3;
+              break;
+            case 2:
+              _context3.p = 2;
+              _t3 = _context3.v;
+              console.error('❌ Error loading scene:', _t3);
+              this.emit('sceneLoadError', {
+                error: _t3,
+                sceneData: sceneData
+              });
+            case 3:
+              return _context3.a(2);
+          }
+        }, _callee3, this, [[0, 2]]);
+      }));
+      function loadScene(_x) {
+        return _loadScene.apply(this, arguments);
+      }
+      return loadScene;
+    }()
+    /**
+     * Add a component to the scene
+     */
+    )
+  }, {
+    key: "addComponentToScene",
+    value: function addComponentToScene(componentData) {
+      var position = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : new THREE__namespace.Vector3();
+      try {
+        if (this.componentManager) {
+          return this.componentManager.addComponent(componentData, position);
+        }
+        return false;
+      } catch (error) {
+        console.error('❌ Error adding component:', error);
+        return false;
+      }
+    }
+
+    /**
+     * Export scene data
+     */
+  }, {
+    key: "exportScene",
+    value: function exportScene() {
+      try {
+        if (this.sceneExportManager) {
+          return this.sceneExportManager.exportScene();
+        }
+        return null;
+      } catch (error) {
+        console.error('❌ Error exporting scene:', error);
+        return null;
+      }
+    }
+
+    /**
+     * Toggle camera auto rotation
+     */
+  }, {
+    key: "toggleCameraRotation",
+    value: function toggleCameraRotation() {
+      if (this.cameraControlsManager) {
+        return this.cameraControlsManager.toggleCameraRotation();
+      }
+      return false;
+    }
+
+    /**
+     * Get selected transform data
+     */
+  }, {
+    key: "getSelectedTransform",
+    value: function getSelectedTransform() {
+      if (this.transformManager && this.selectedObjectForTransform) {
+        return this.transformManager.getTransformData(this.selectedObjectForTransform);
+      }
+      return null;
+    }
+
+    /**
+     * Event system methods
+     */
+  }, {
+    key: "on",
+    value: function on(eventName, callback) {
+      if (!this.eventCallbacks.has(eventName)) {
+        this.eventCallbacks.set(eventName, []);
+      }
+      this.eventCallbacks.get(eventName).push(callback);
+    }
+  }, {
+    key: "off",
+    value: function off(eventName, callback) {
+      if (this.eventCallbacks.has(eventName)) {
+        var callbacks = this.eventCallbacks.get(eventName);
+        var index = callbacks.indexOf(callback);
+        if (index > -1) {
+          callbacks.splice(index, 1);
+        }
+      }
+    }
+  }, {
+    key: "emit",
+    value: function emit(eventName) {
+      var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+      if (this.eventCallbacks.has(eventName)) {
+        this.eventCallbacks.get(eventName).forEach(function (callback) {
+          try {
+            callback(data);
+          } catch (error) {
+            console.error("\u274C Error in event callback for ".concat(eventName, ":"), error);
+          }
+        });
+      }
+    }
+
+    /**
+     * Dispose of the scene viewer and clean up resources
+     */
+  }, {
+    key: "dispose",
+    value: function dispose() {
+      console.log('🧹 Disposing SceneViewer...');
+      this.isDestroyed = true;
+      try {
+        // Clean up event listeners
+        this.eventCallbacks.clear();
+
+        // Clean up resize observer
+        if (this.resizeObserver) {
+          this.resizeObserver.disconnect();
+          this.resizeObserver = null;
+        }
+
+        // Clean up DOM event listeners
+        if (this.container) {
+          this.container.removeEventListener('click', this.handleClick);
+          this.container.removeEventListener('dblclick', this.handleDoubleClick);
+          this.container.removeEventListener('dragover', this.handleDragOver);
+          this.container.removeEventListener('drop', this.handleDrop);
+          this.container.removeEventListener('dragenter', this.handleDragEnter);
+          this.container.removeEventListener('dragleave', this.handleDragLeave);
+        }
+
+        // Dispose of managers using disposal manager
+        if (this.disposalManager) {
+          this.disposalManager.cleanupEventListeners();
+          this.disposalManager.cleanupPerformanceMonitoring();
+          this.disposalManager.cleanupControls();
+          this.disposalManager.cleanupScene();
+          this.disposalManager.cleanupRenderer();
+        }
+
+        // Remove renderer from DOM
+        if (this.renderer && this.renderer.domElement && this.container) {
+          this.container.removeChild(this.renderer.domElement);
+        }
+
+        // Dispose of renderer
+        if (this.renderer) {
+          this.renderer.dispose();
+          this.renderer = null;
+        }
+
+        // Clear references
+        this.scene = null;
+        this.camera = null;
+        this.controls = null;
+        this.currentSceneData = null;
+        this.selectedObjectForTransform = null;
+        console.log('✅ SceneViewer disposed successfully');
+      } catch (error) {
+        console.error('❌ Error during SceneViewer disposal:', error);
+      }
+    }
+  }]);
+}();
+
+exports.SceneViewer = SceneViewer;
+exports["default"] = SceneViewer;