@2112-lab/central-plant 0.1.4 → 0.1.6

package/dist/esm/src/managers/environment/environmentManager.js

@@ -1 +1,690 @@
-import{createClass as e,classCallCheck as r,asyncToGenerator as n,regenerator as t,regeneratorValues as a,createForOfIteratorHelper as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import*as i from"three";import{RGBELoader as s}from"../../../node_modules/three/examples/jsm/loaders/RGBELoader.js";import{loadTextureSetAndCreateMaterial as u}from"./textureConfig.js";import{logger as c}from"../../core/debugLogger.js";var l=function(){return e(function e(n){r(this,e),this.sceneViewer=n},[{key:"createSkybox",value:(y=n(t().m(function e(){var r,n,u,c,l,f,d,v,h,k;return t().w(function(e){for(;;)switch(e.n){case 0:r=this.sceneViewer,(n=new i.PMREMGenerator(r.renderer)).compileEquirectangularShader(),u=[{type:"hdr",loader:new s,paths:["/skyboxes/kloofendal_48d_partly_cloudy_puresky_2k.hdr","/skyboxes/kloofendal_48d_partly_cloudy_puresky_1k.hdr"]},{type:"jpeg",loader:r.textureLoader,paths:["/skyboxes/sky_fallback.jpg"]}],c=function(e,t){try{var a,o;e.mapping=i.EquirectangularReflectionMapping;var s=n.fromEquirectangular(e).texture;return null!==(a=r.scene.environment)&&void 0!==a&&a.dispose&&r.scene.environment.dispose(),null!==(o=r.scene.background)&&void 0!==o&&o.dispose&&r.scene.background.dispose(),r.scene.environment=s,r.scene.background=s,e.dispose(),!0}catch(e){return!1}},l=t().m(function e(){var r,i,s,u,l,f,h,k;return t().w(function(e){for(;;)switch(e.n){case 0:(r=v[d]).type,i=r.loader,s=r.paths,u=o(s),e.p=1,f=t().m(function e(){var r,a;return t().w(function(e){for(;;)switch(e.n){case 0:return r=l.value,e.p=1,e.n=2,new Promise(function(e,n){var t=setTimeout(function(){return n(new Error("Timeout"))},1e4);i.load(r,function(r){clearTimeout(t),e(r)},void 0,function(e){clearTimeout(t),n(e)})});case 2:if(a=e.v,!c(a)){e.n=3;break}return n.dispose(),e.a(2,{v:{v:void 0}});case 3:e.n=5;break;case 4:e.p=4,e.v;case 5:return e.a(2)}},e,null,[[1,4]])}),u.s();case 2:if((l=u.n()).done){e.n=5;break}return e.d(a(f()),3);case 3:if(!(h=e.v)){e.n=4;break}return e.a(2,h.v);case 4:e.n=2;break;case 5:e.n=7;break;case 6:e.p=6,k=e.v,u.e(k);case 7:return e.p=7,u.f(),e.f(7);case 8:return e.a(2)}},e,null,[[1,6,7,8]])}),d=0,v=u;case 1:if(!(d<v.length)){e.n=4;break}return e.d(a(l()),2);case 2:if(!(f=e.v)){e.n=3;break}return e.a(2,f.v);case 3:d++,e.n=1;break;case 4:h=new i.AmbientLight(16777215,.6),r.scene.add(h),(k=new i.Scene).add(new i.HemisphereLight(8900331,4473975,1)),r.scene.environment=n.fromScene(k).texture,r.scene.background=new i.Color(8900331),n.dispose();case 5:return e.a(2)}},e,this)})),function(){return y.apply(this,arguments)})},{key:"setupLighting",value:function(){var e=this.sceneViewer;e.scene.children=e.scene.children.filter(function(e){return!(e instanceof i.Light)});var r=new i.DirectionalLight(16777195,5);r.position.set(15,30,-10),r.castShadow=!0,r.shadow.camera.near=.1,r.shadow.camera.far=100,r.shadow.camera.left=-50,r.shadow.camera.right=50,r.shadow.camera.top=50,r.shadow.camera.bottom=-50,r.shadow.mapSize.width=2048,r.shadow.mapSize.height=2048,e.scene.add(r);var n=new i.DirectionalLight(16777164,.4);n.position.set(-10,10,-10),e.scene.add(n),c.info("Scene lighting setup completed")}},{key:"addTexturedGround",value:(k=n(t().m(function e(){var r,n,a,o,s,l;return t().w(function(e){for(;;)switch(e.n){case 0:return r=this.sceneViewer,c.debug("Starting addTexturedGround..."),n=new i.PlaneGeometry(30,30),a=new i.MeshStandardMaterial({color:7829367,metalness:.2,roughness:.9}),(o=new i.Mesh(n,a)).rotation.x=-Math.PI/2,o.position.y=0,o.receiveShadow=!0,o.name="Ground",o.userData.isBaseGround=!0,r.scene.add(o),e.p=1,c.debug("Loading concrete texture set..."),e.n=2,u("gravel_embedded_concrete",r.textureLoader);case 2:s=e.v,o.material=s,o.material.needsUpdate=!0,c.success("Ground material updated with textures"),e.n=4;break;case 3:e.p=3,l=e.v,c.warn("Error loading ground textures:",l);case 4:return e.a(2)}},e,this,[[1,3]])})),function(){return k.apply(this,arguments)})},{key:"addBrickWalls",value:(h=n(t().m(function e(){var r,n,a,o,s,l,f;return t().w(function(e){for(;;)switch(e.n){case 0:return r=this.sceneViewer,c.debug("Starting addBrickWalls..."),n=2.5,a=.5,o=new i.MeshPhysicalMaterial({color:7824226,roughness:.9,metalness:.1,clearcoat:.05,clearcoatRoughness:.4}),s=function(e){var t=function(n,t,a,o,s,u){var c=arguments.length>6&&void 0!==arguments[6]?arguments[6]:0,l=arguments.length>7&&void 0!==arguments[7]?arguments[7]:1,f=new i.BoxGeometry(n,t,a);if(1!==l){for(var d=f.attributes.uv,v=d.array,h=0;h<v.length;h+=2)v[h+1]*=l;d.needsUpdate=!0}var k=new i.Mesh(f,e);return k.position.set(o,s-.56,u),0!==c&&k.rotateY(c),k.userData.isBrickWall=!0,k.castShadow=!0,k.receiveShadow=!0,k.name="Wall",r.scene.add(k),k};t(30,n,a,0,1.25,14.75,0,1),t(30,n,a,0,1.25,-14.75,0,1),t(a,8.5,29,14.75,4.25,0,0,3.4),t(a,n,29,-14.75,1.25,0,0,1)},s(o),c.debug("Basic brick walls created"),e.p=1,c.debug("Loading brick texture set..."),e.n=2,u("brick",r.textureLoader);case 2:l=e.v,r.scene.traverse(function(e){e.isMesh&&e.userData.isBrickWall&&(e.material=l,e.material.needsUpdate=!0)}),c.success("Brick walls updated with textures"),e.n=4;break;case 3:e.p=3,f=e.v,c.warn("Error loading brick textures:",f);case 4:return e.a(2)}},e,this,[[1,3]])})),function(){return h.apply(this,arguments)})},{key:"addHorizonFog",value:function(){var e=this.sceneViewer,r=new i.ShaderMaterial({transparent:!0,uniforms:{fogColor:{value:new i.Color(5533306)},fogDensity:{value:1}},vertexShader:"\n        varying vec2 vUv;\n        void main() {\n          vUv = uv;\n          gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\n        }\n      ",fragmentShader:"\n        uniform vec3 fogColor;\n        uniform float fogDensity;\n        varying vec2 vUv;\n        \n        void main() {\n          vec2 center = vec2(0.5, 0.5);\n          float dist = distance(vUv, center);\n          float opacity = (1.0 - smoothstep(0.0, 0.5, dist)) * fogDensity;\n          gl_FragColor = vec4(fogColor, opacity);\n        }\n      ",side:i.DoubleSide}),n=new i.PlaneGeometry(300,300),t=new i.Mesh(n,r);return t.rotation.x=-Math.PI/2,t.position.y=-3,t.name="fogPlane",e.scene.add(t),t}},{key:"initializeEnvironment",value:(v=n(t().m(function e(){return t().w(function(e){for(;;)switch(e.n){case 0:return e.n=1,this.createSkybox();case 1:return this.setupLighting(),e.n=2,this.addTexturedGround();case 2:return e.n=3,this.addBrickWalls();case 3:this.addHorizonFog(),c.info("Environment initialization completed");case 4:return e.a(2)}},e,this)})),function(){return v.apply(this,arguments)})},{key:"removeSkybox",value:function(){var e=this.sceneViewer;try{var r,n;return null!==(r=e.scene.environment)&&void 0!==r&&r.dispose&&e.scene.environment.dispose(),null!==(n=e.scene.background)&&void 0!==n&&n.dispose&&e.scene.background.dispose(),e.scene.environment=null,e.scene.background=new i.Color(16777215),c.info("Skybox removed successfully"),!0}catch(e){return!1}}},{key:"setSkyboxType",value:(d=n(t().m(function e(r){var n,a,o,s,u;return t().w(function(e){for(;;)switch(e.n){case 0:n=this.sceneViewer,e.p=1,null!==(a=n.scene.environment)&&void 0!==a&&a.dispose&&n.scene.environment.dispose(),null!==(o=n.scene.background)&&void 0!==o&&o.dispose&&n.scene.background.dispose(),(s=new i.PMREMGenerator(n.renderer)).compileEquirectangularShader(),u=r,e.n="HDR"===u?2:"Fallback"===u?4:"Color"===u?6:7;break;case 2:return e.n=3,this.loadHDRSkybox(s);case 3:case 5:return e.a(3,8);case 4:return e.n=5,this.loadFallbackSkybox(s);case 6:return this.setColorBackground(),e.a(3,8);case 7:return e.n=8,this.loadHDRSkybox(s);case 8:return s.dispose(),c.info("Skybox type changed to: ".concat(r)),e.a(2,!0);case 9:return e.p=9,e.v,e.a(2,!1)}},e,this,[[1,9]])})),function(e){return d.apply(this,arguments)})},{key:"loadHDRSkybox",value:(f=n(t().m(function e(r){var n,o,u,c,l,f,d;return t().w(function(e){for(;;)switch(e.n){case 0:n=this.sceneViewer,o=new s,u=["/skyboxes/kloofendal_48d_partly_cloudy_puresky_2k.hdr","/skyboxes/kloofendal_48d_partly_cloudy_puresky_1k.hdr"],c=t().m(function e(){var a,s,u;return t().w(function(e){for(;;)switch(e.n){case 0:return a=d[f],e.p=1,e.n=2,new Promise(function(e,r){var n=setTimeout(function(){return r(new Error("Timeout"))},1e4);o.load(a,function(r){clearTimeout(n),e(r)},void 0,function(e){clearTimeout(n),r(e)})});case 2:return(s=e.v).mapping=i.EquirectangularReflectionMapping,u=r.fromEquirectangular(s).texture,n.scene.environment=u,n.scene.background=u,s.dispose(),e.a(2,{v:void 0});case 3:e.p=3,e.v;case 4:return e.a(2)}},e,null,[[1,3]])}),f=0,d=u;case 1:if(!(f<d.length)){e.n=4;break}return e.d(a(c()),2);case 2:if(!(l=e.v)){e.n=3;break}return e.a(2,l.v);case 3:f++,e.n=1;break;case 4:throw new Error("Failed to load any HDR skybox");case 5:return e.a(2)}},e,this)})),function(e){return f.apply(this,arguments)})},{key:"loadFallbackSkybox",value:(l=n(t().m(function e(r){var n,a,o;return t().w(function(e){for(;;)switch(e.n){case 0:return n=this.sceneViewer,e.p=1,e.n=2,new Promise(function(e,r){var t=setTimeout(function(){return r(new Error("Timeout"))},1e4);n.textureLoader.load("/skyboxes/sky_fallback.jpg",function(r){clearTimeout(t),e(r)},void 0,function(e){clearTimeout(t),r(e)})});case 2:(a=e.v).mapping=i.EquirectangularReflectionMapping,o=r.fromEquirectangular(a).texture,n.scene.environment=o,n.scene.background=o,a.dispose(),e.n=4;break;case 3:throw e.p=3,e.v;case 4:return e.a(2)}},e,this,[[1,3]])})),function(e){return l.apply(this,arguments)})},{key:"setColorBackground",value:function(){var e=this.sceneViewer;e.scene.environment=null,e.scene.background=new i.Color(16777215);var r=new i.AmbientLight(16777215,.6);e.scene.add(r)}}]);var l,f,d,v,h,k,y}();export{l as EnvironmentManager};
+import { createClass as _createClass, classCallCheck as _classCallCheck, asyncToGenerator as _asyncToGenerator, regenerator as _regenerator, regeneratorValues as _regeneratorValues, createForOfIteratorHelper as _createForOfIteratorHelper } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import * as THREE from 'three';
+import { RGBELoader } from '../../../node_modules/three/examples/jsm/loaders/RGBELoader.js';
+import { loadTextureSetAndCreateMaterial } from './textureConfig.js';
+import { logger } from '../../core/debugLogger.js';
+
+var EnvironmentManager = /*#__PURE__*/function () {
+  function EnvironmentManager(sceneViewer) {
+    _classCallCheck(this, EnvironmentManager);
+    this.sceneViewer = sceneViewer;
+  }
+
+  /**
+   * Create skybox with HDR environment mapping
+   */
+  return _createClass(EnvironmentManager, [{
+    key: "createSkybox",
+    value: (function () {
+      var _createSkybox = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
+        var component, pmremGenerator, loaders, applyEnvironmentMap, _loop, _ret, _i, _loaders, ambientLight, skyScene;
+        return _regenerator().w(function (_context3) {
+          while (1) switch (_context3.n) {
+            case 0:
+              component = this.sceneViewer;
+              pmremGenerator = new THREE.PMREMGenerator(component.renderer);
+              pmremGenerator.compileEquirectangularShader();
+              loaders = [{
+                type: 'hdr',
+                loader: new RGBELoader(),
+                paths: ['/skyboxes/kloofendal_48d_partly_cloudy_puresky_2k.hdr', '/skyboxes/kloofendal_48d_partly_cloudy_puresky_1k.hdr']
+              }, {
+                type: 'jpeg',
+                loader: component.textureLoader,
+                paths: ['/skyboxes/sky_fallback.jpg']
+              }];
+              applyEnvironmentMap = function applyEnvironmentMap(envTexture, type) {
+                try {
+                  var _component$scene$envi, _component$scene$back;
+                  envTexture.mapping = THREE.EquirectangularReflectionMapping;
+                  var processedEnvMap = pmremGenerator.fromEquirectangular(envTexture).texture;
+                  if ((_component$scene$envi = component.scene.environment) !== null && _component$scene$envi !== void 0 && _component$scene$envi.dispose) component.scene.environment.dispose();
+                  if ((_component$scene$back = component.scene.background) !== null && _component$scene$back !== void 0 && _component$scene$back.dispose) component.scene.background.dispose();
+                  component.scene.environment = processedEnvMap;
+                  component.scene.background = processedEnvMap;
+                  envTexture.dispose();
+                  console.log("\u2705 ".concat(type.toUpperCase(), " environment map applied successfully"));
+                  return true;
+                } catch (error) {
+                  console.warn("\u274C Failed to apply ".concat(type, " environment map:"), error);
+                  return false;
+                }
+              };
+              _loop = /*#__PURE__*/_regenerator().m(function _loop() {
+                var _loaders$_i, type, loader, paths, _iterator, _step, _loop2, _ret2, _t2;
+                return _regenerator().w(function (_context2) {
+                  while (1) switch (_context2.n) {
+                    case 0:
+                      _loaders$_i = _loaders[_i], type = _loaders$_i.type, loader = _loaders$_i.loader, paths = _loaders$_i.paths;
+                      _iterator = _createForOfIteratorHelper(paths);
+                      _context2.p = 1;
+                      _loop2 = /*#__PURE__*/_regenerator().m(function _loop2() {
+                        var path, texture, _t;
+                        return _regenerator().w(function (_context) {
+                          while (1) switch (_context.n) {
+                            case 0:
+                              path = _step.value;
+                              _context.p = 1;
+                              console.log("\uD83D\uDD04 Attempting to load ".concat(type.toUpperCase(), ": ").concat(path));
+                              _context.n = 2;
+                              return new Promise(function (resolve, reject) {
+                                var timeout = setTimeout(function () {
+                                  return reject(new Error('Timeout'));
+                                }, 10000);
+                                loader.load(path, function (tex) {
+                                  clearTimeout(timeout);
+                                  resolve(tex);
+                                }, undefined, function (err) {
+                                  clearTimeout(timeout);
+                                  reject(err);
+                                });
+                              });
+                            case 2:
+                              texture = _context.v;
+                              if (!applyEnvironmentMap(texture, type)) {
+                                _context.n = 3;
+                                break;
+                              }
+                              pmremGenerator.dispose();
+                              return _context.a(2, {
+                                v: {
+                                  v: void 0
+                                }
+                              });
+                            case 3:
+                              _context.n = 5;
+                              break;
+                            case 4:
+                              _context.p = 4;
+                              _t = _context.v;
+                              console.warn("\u26A0\uFE0F Failed to load ".concat(path, ":"), _t.message);
+                            case 5:
+                              return _context.a(2);
+                          }
+                        }, _loop2, null, [[1, 4]]);
+                      });
+                      _iterator.s();
+                    case 2:
+                      if ((_step = _iterator.n()).done) {
+                        _context2.n = 5;
+                        break;
+                      }
+                      return _context2.d(_regeneratorValues(_loop2()), 3);
+                    case 3:
+                      _ret2 = _context2.v;
+                      if (!_ret2) {
+                        _context2.n = 4;
+                        break;
+                      }
+                      return _context2.a(2, _ret2.v);
+                    case 4:
+                      _context2.n = 2;
+                      break;
+                    case 5:
+                      _context2.n = 7;
+                      break;
+                    case 6:
+                      _context2.p = 6;
+                      _t2 = _context2.v;
+                      _iterator.e(_t2);
+                    case 7:
+                      _context2.p = 7;
+                      _iterator.f();
+                      return _context2.f(7);
+                    case 8:
+                      return _context2.a(2);
+                  }
+                }, _loop, null, [[1, 6, 7, 8]]);
+              });
+              _i = 0, _loaders = loaders;
+            case 1:
+              if (!(_i < _loaders.length)) {
+                _context3.n = 4;
+                break;
+              }
+              return _context3.d(_regeneratorValues(_loop()), 2);
+            case 2:
+              _ret = _context3.v;
+              if (!_ret) {
+                _context3.n = 3;
+                break;
+              }
+              return _context3.a(2, _ret.v);
+            case 3:
+              _i++;
+              _context3.n = 1;
+              break;
+            case 4:
+              console.log('🎨 Using procedural sky fallback');
+              ambientLight = new THREE.AmbientLight(0xffffff, 0.6);
+              component.scene.add(ambientLight);
+              skyScene = new THREE.Scene();
+              skyScene.add(new THREE.HemisphereLight(0x87CEEB, 0x444477, 1));
+              component.scene.environment = pmremGenerator.fromScene(skyScene).texture;
+              component.scene.background = new THREE.Color(0x87CEEB);
+              pmremGenerator.dispose();
+            case 5:
+              return _context3.a(2);
+          }
+        }, _callee, this);
+      }));
+      function createSkybox() {
+        return _createSkybox.apply(this, arguments);
+      }
+      return createSkybox;
+    }()
+    /**
+     * Setup scene lighting
+     */
+    )
+  }, {
+    key: "setupLighting",
+    value: function setupLighting() {
+      var component = this.sceneViewer;
+
+      // Remove existing lights
+      component.scene.children = component.scene.children.filter(function (child) {
+        return !(child instanceof THREE.Light);
+      });
+
+      // Sun light (main directional light)
+      var sunLight = new THREE.DirectionalLight(0xffffeb, 5);
+      sunLight.position.set(15, 30, -10);
+      sunLight.castShadow = true;
+      sunLight.shadow.camera.near = 0.1;
+      sunLight.shadow.camera.far = 100;
+      sunLight.shadow.camera.left = -50;
+      sunLight.shadow.camera.right = 50;
+      sunLight.shadow.camera.top = 50;
+      sunLight.shadow.camera.bottom = -50;
+      sunLight.shadow.mapSize.width = 2048;
+      sunLight.shadow.mapSize.height = 2048;
+      component.scene.add(sunLight);
+      // component.scene.add(sunLight.target)
+
+      // // Ambient hemispheric light
+      // const ambientLight = new THREE.HemisphereLight(0xffffff, 0x444466, 0.35)
+      // component.scene.add(ambientLight)
+
+      // Fill light (secondary directional light)
+      var fillLight = new THREE.DirectionalLight(0xffffcc, 0.4);
+      fillLight.position.set(-10, 10, -10);
+      component.scene.add(fillLight);
+
+      // // Rim light (for edge definition)
+      // const rimLight = new THREE.DirectionalLight(0xffffff, 0.9)
+      // rimLight.position.set(0, 0, -20)
+      // component.scene.add(rimLight)
+
+      // // Spot light (for focused illumination)
+      // const spotLight = new THREE.SpotLight(0xffffff, 0.5)
+      // spotLight.position.set(5, 15, 5)
+      // spotLight.angle = Math.PI / 6
+      // spotLight.penumbra = 0.3
+      // spotLight.decay = 1.5
+      // spotLight.distance = 50
+      // spotLight.castShadow = true
+      // spotLight.shadow.bias = -0.0003
+      // spotLight.shadow.mapSize.width = 2048
+      // spotLight.shadow.mapSize.height = 2048
+      // component.scene.add(spotLight)
+
+      logger.info('Scene lighting setup completed');
+    }
+
+    /**
+     * Add textured ground plane
+     */
+  }, {
+    key: "addTexturedGround",
+    value: (function () {
+      var _addTexturedGround = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2() {
+        var component, groundSize, groundGeometry, groundMaterial, ground, texturedMaterial, _t3;
+        return _regenerator().w(function (_context4) {
+          while (1) switch (_context4.n) {
+            case 0:
+              component = this.sceneViewer;
+              logger.debug('Starting addTexturedGround...');
+              groundSize = 30;
+              groundGeometry = new THREE.PlaneGeometry(groundSize, groundSize);
+              groundMaterial = new THREE.MeshStandardMaterial({
+                color: 0x777777,
+                metalness: 0.2,
+                roughness: 0.9
+              });
+              ground = new THREE.Mesh(groundGeometry, groundMaterial);
+              ground.rotation.x = -Math.PI / 2;
+              ground.position.y = 0;
+              ground.receiveShadow = true;
+              ground.name = 'Ground';
+              ground.userData.isBaseGround = true;
+              component.scene.add(ground);
+              _context4.p = 1;
+              logger.debug('Loading concrete texture set...');
+              _context4.n = 2;
+              return loadTextureSetAndCreateMaterial('gravel_embedded_concrete', component.textureLoader);
+            case 2:
+              texturedMaterial = _context4.v;
+              ground.material = texturedMaterial;
+              ground.material.needsUpdate = true;
+              logger.success('Ground material updated with textures');
+              _context4.n = 4;
+              break;
+            case 3:
+              _context4.p = 3;
+              _t3 = _context4.v;
+              logger.warn('Error loading ground textures:', _t3);
+            case 4:
+              return _context4.a(2);
+          }
+        }, _callee2, this, [[1, 3]]);
+      }));
+      function addTexturedGround() {
+        return _addTexturedGround.apply(this, arguments);
+      }
+      return addTexturedGround;
+    }()
+    /**
+     * Add brick walls around the scene
+     */
+    )
+  }, {
+    key: "addBrickWalls",
+    value: (function () {
+      var _addBrickWalls = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee3() {
+        var component, wallHeight, wallThickness, groundSize, halfGroundSize, brickMaterial, createWalls, texturedBrickMaterial, _t4;
+        return _regenerator().w(function (_context5) {
+          while (1) switch (_context5.n) {
+            case 0:
+              component = this.sceneViewer;
+              logger.debug('Starting addBrickWalls...');
+              wallHeight = 2.5;
+              wallThickness = 0.5;
+              groundSize = 30;
+              halfGroundSize = groundSize / 2;
+              brickMaterial = new THREE.MeshPhysicalMaterial({
+                color: 0x776362,
+                roughness: 0.9,
+                metalness: 0.1,
+                clearcoat: 0.05,
+                clearcoatRoughness: 0.4
+              });
+              createWalls = function createWalls(material) {
+                var createWall = function createWall(width, height, depth, x, y, z) {
+                  var rotation = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : 0;
+                  var textureScaleY = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 1;
+                  var geometry = new THREE.BoxGeometry(width, height, depth);
+                  if (textureScaleY !== 1) {
+                    var uvAttribute = geometry.attributes.uv;
+                    var uvArray = uvAttribute.array;
+                    for (var i = 0; i < uvArray.length; i += 2) {
+                      uvArray[i + 1] *= textureScaleY;
+                    }
+                    uvAttribute.needsUpdate = true;
+                  }
+                  var wall = new THREE.Mesh(geometry, material);
+                  wall.position.set(x, y - 0.56, z);
+                  if (rotation !== 0) {
+                    wall.rotateY(rotation);
+                  }
+                  wall.userData.isBrickWall = true;
+                  wall.castShadow = true;
+                  wall.receiveShadow = true;
+                  wall.name = "Wall";
+                  component.scene.add(wall);
+                  return wall;
+                };
+
+                // Create walls with optimized direct values
+                createWall(groundSize, wallHeight, wallThickness, 0, wallHeight / 2, halfGroundSize - wallThickness / 2, 0, 1.0);
+                createWall(groundSize, wallHeight, wallThickness, 0, wallHeight / 2, -halfGroundSize + wallThickness / 2, 0, 1.0);
+                createWall(wallThickness, wallHeight + 6.0, groundSize - wallThickness * 2, halfGroundSize - wallThickness / 2, (wallHeight + 6.0) / 2, 0, 0, (wallHeight + 6.0) / wallHeight);
+                createWall(wallThickness, wallHeight, groundSize - wallThickness * 2, -halfGroundSize + wallThickness / 2, wallHeight / 2, 0, 0, 1.0);
+              };
+              createWalls(brickMaterial);
+              logger.debug('Basic brick walls created');
+              _context5.p = 1;
+              logger.debug('Loading brick texture set...');
+              _context5.n = 2;
+              return loadTextureSetAndCreateMaterial('brick', component.textureLoader);
+            case 2:
+              texturedBrickMaterial = _context5.v;
+              component.scene.traverse(function (object) {
+                if (object.isMesh && object.userData.isBrickWall) {
+                  object.material = texturedBrickMaterial;
+                  object.material.needsUpdate = true;
+                }
+              });
+              logger.success('Brick walls updated with textures');
+              _context5.n = 4;
+              break;
+            case 3:
+              _context5.p = 3;
+              _t4 = _context5.v;
+              logger.warn('Error loading brick textures:', _t4);
+            case 4:
+              return _context5.a(2);
+          }
+        }, _callee3, this, [[1, 3]]);
+      }));
+      function addBrickWalls() {
+        return _addBrickWalls.apply(this, arguments);
+      }
+      return addBrickWalls;
+    }()
+    /**
+     * Add horizon fog effect
+     */
+    )
+  }, {
+    key: "addHorizonFog",
+    value: function addHorizonFog() {
+      var component = this.sceneViewer;
+      var groundSize = 30;
+      var fogSize = groundSize * 10;
+      var fogMaterial = new THREE.ShaderMaterial({
+        transparent: true,
+        uniforms: {
+          fogColor: {
+            value: new THREE.Color(0x546E7A)
+          },
+          fogDensity: {
+            value: 1
+          }
+        },
+        vertexShader: "\n        varying vec2 vUv;\n        void main() {\n          vUv = uv;\n          gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\n        }\n      ",
+        fragmentShader: "\n        uniform vec3 fogColor;\n        uniform float fogDensity;\n        varying vec2 vUv;\n        \n        void main() {\n          vec2 center = vec2(0.5, 0.5);\n          float dist = distance(vUv, center);\n          float opacity = (1.0 - smoothstep(0.0, 0.5, dist)) * fogDensity;\n          gl_FragColor = vec4(fogColor, opacity);\n        }\n      ",
+        side: THREE.DoubleSide
+      });
+      var fogGeometry = new THREE.PlaneGeometry(fogSize, fogSize);
+      var fogPlane = new THREE.Mesh(fogGeometry, fogMaterial);
+      fogPlane.rotation.x = -Math.PI / 2;
+      fogPlane.position.y = -3.0;
+      fogPlane.name = "fogPlane";
+      component.scene.add(fogPlane);
+      return fogPlane;
+    }
+
+    /**
+     * Initialize complete environment
+     */
+  }, {
+    key: "initializeEnvironment",
+    value: (function () {
+      var _initializeEnvironment = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee4() {
+        return _regenerator().w(function (_context6) {
+          while (1) switch (_context6.n) {
+            case 0:
+              _context6.n = 1;
+              return this.createSkybox();
+            case 1:
+              this.setupLighting();
+              _context6.n = 2;
+              return this.addTexturedGround();
+            case 2:
+              _context6.n = 3;
+              return this.addBrickWalls();
+            case 3:
+              this.addHorizonFog();
+              logger.info('Environment initialization completed');
+            case 4:
+              return _context6.a(2);
+          }
+        }, _callee4, this);
+      }));
+      function initializeEnvironment() {
+        return _initializeEnvironment.apply(this, arguments);
+      }
+      return initializeEnvironment;
+    }()
+    /**
+     * Remove the current skybox and reset to a plain background
+     */
+    )
+  }, {
+    key: "removeSkybox",
+    value: function removeSkybox() {
+      var component = this.sceneViewer;
+      try {
+        var _component$scene$envi2, _component$scene$back2;
+        // Dispose of current environment and background textures
+        if ((_component$scene$envi2 = component.scene.environment) !== null && _component$scene$envi2 !== void 0 && _component$scene$envi2.dispose) {
+          component.scene.environment.dispose();
+        }
+        if ((_component$scene$back2 = component.scene.background) !== null && _component$scene$back2 !== void 0 && _component$scene$back2.dispose) {
+          component.scene.background.dispose();
+        }
+
+        // Set to null/plain background
+        component.scene.environment = null;
+        component.scene.background = new THREE.Color(0xffffff); // White background
+
+        logger.info('Skybox removed successfully');
+        return true;
+      } catch (error) {
+        console.error('❌ Error removing skybox:', error);
+        return false;
+      }
+    }
+
+    /**
+     * Set the skybox type dynamically
+     * @param {string} skyboxType - 'HDR', 'Fallback', or 'Color'
+     */
+  }, {
+    key: "setSkyboxType",
+    value: (function () {
+      var _setSkyboxType = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee5(skyboxType) {
+        var component, _component$scene$envi3, _component$scene$back3, _pmremGenerator, _t5, _t6;
+        return _regenerator().w(function (_context7) {
+          while (1) switch (_context7.n) {
+            case 0:
+              component = this.sceneViewer;
+              _context7.p = 1;
+              console.log("\uD83C\uDF0C Changing skybox type to: ".concat(skyboxType));
+
+              // Dispose of current environment textures
+              if ((_component$scene$envi3 = component.scene.environment) !== null && _component$scene$envi3 !== void 0 && _component$scene$envi3.dispose) {
+                component.scene.environment.dispose();
+              }
+              if ((_component$scene$back3 = component.scene.background) !== null && _component$scene$back3 !== void 0 && _component$scene$back3.dispose) {
+                component.scene.background.dispose();
+              }
+              _pmremGenerator = new THREE.PMREMGenerator(component.renderer);
+              _pmremGenerator.compileEquirectangularShader();
+              _t5 = skyboxType;
+              _context7.n = _t5 === 'HDR' ? 2 : _t5 === 'Fallback' ? 4 : _t5 === 'Color' ? 6 : 7;
+              break;
+            case 2:
+              _context7.n = 3;
+              return this.loadHDRSkybox(_pmremGenerator);
+            case 3:
+              return _context7.a(3, 8);
+            case 4:
+              _context7.n = 5;
+              return this.loadFallbackSkybox(_pmremGenerator);
+            case 5:
+              return _context7.a(3, 8);
+            case 6:
+              this.setColorBackground();
+              return _context7.a(3, 8);
+            case 7:
+              console.warn("Unknown skybox type: ".concat(skyboxType, ", falling back to HDR"));
+              _context7.n = 8;
+              return this.loadHDRSkybox(_pmremGenerator);
+            case 8:
+              _pmremGenerator.dispose();
+              logger.info("Skybox type changed to: ".concat(skyboxType));
+              return _context7.a(2, true);
+            case 9:
+              _context7.p = 9;
+              _t6 = _context7.v;
+              console.error('❌ Error setting skybox type:', _t6);
+              return _context7.a(2, false);
+          }
+        }, _callee5, this, [[1, 9]]);
+      }));
+      function setSkyboxType(_x) {
+        return _setSkyboxType.apply(this, arguments);
+      }
+      return setSkyboxType;
+    }()
+    /**
+     * Load HDR skybox specifically
+     */
+    )
+  }, {
+    key: "loadHDRSkybox",
+    value: (function () {
+      var _loadHDRSkybox = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee6(pmremGenerator) {
+        var component, rgbeLoader, hdrPaths, _loop3, _ret3, _i2, _hdrPaths;
+        return _regenerator().w(function (_context9) {
+          while (1) switch (_context9.n) {
+            case 0:
+              component = this.sceneViewer;
+              rgbeLoader = new RGBELoader();
+              hdrPaths = ['/skyboxes/kloofendal_48d_partly_cloudy_puresky_2k.hdr', '/skyboxes/kloofendal_48d_partly_cloudy_puresky_1k.hdr'];
+              _loop3 = /*#__PURE__*/_regenerator().m(function _loop3() {
+                var path, texture, processedEnvMap, _t7;
+                return _regenerator().w(function (_context8) {
+                  while (1) switch (_context8.n) {
+                    case 0:
+                      path = _hdrPaths[_i2];
+                      _context8.p = 1;
+                      console.log("\uD83D\uDD04 Loading HDR: ".concat(path));
+                      _context8.n = 2;
+                      return new Promise(function (resolve, reject) {
+                        var timeout = setTimeout(function () {
+                          return reject(new Error('Timeout'));
+                        }, 10000);
+                        rgbeLoader.load(path, function (tex) {
+                          clearTimeout(timeout);
+                          resolve(tex);
+                        }, undefined, function (err) {
+                          clearTimeout(timeout);
+                          reject(err);
+                        });
+                      });
+                    case 2:
+                      texture = _context8.v;
+                      texture.mapping = THREE.EquirectangularReflectionMapping;
+                      processedEnvMap = pmremGenerator.fromEquirectangular(texture).texture;
+                      component.scene.environment = processedEnvMap;
+                      component.scene.background = processedEnvMap;
+                      texture.dispose();
+                      console.log('✅ HDR skybox loaded successfully');
+                      return _context8.a(2, {
+                        v: void 0
+                      });
+                    case 3:
+                      _context8.p = 3;
+                      _t7 = _context8.v;
+                      console.warn("\u26A0\uFE0F Failed to load HDR skybox ".concat(path, ":"), _t7.message);
+                    case 4:
+                      return _context8.a(2);
+                  }
+                }, _loop3, null, [[1, 3]]);
+              });
+              _i2 = 0, _hdrPaths = hdrPaths;
+            case 1:
+              if (!(_i2 < _hdrPaths.length)) {
+                _context9.n = 4;
+                break;
+              }
+              return _context9.d(_regeneratorValues(_loop3()), 2);
+            case 2:
+              _ret3 = _context9.v;
+              if (!_ret3) {
+                _context9.n = 3;
+                break;
+              }
+              return _context9.a(2, _ret3.v);
+            case 3:
+              _i2++;
+              _context9.n = 1;
+              break;
+            case 4:
+              throw new Error('Failed to load any HDR skybox');
+            case 5:
+              return _context9.a(2);
+          }
+        }, _callee6, this);
+      }));
+      function loadHDRSkybox(_x2) {
+        return _loadHDRSkybox.apply(this, arguments);
+      }
+      return loadHDRSkybox;
+    }()
+    /**
+     * Load fallback JPEG skybox
+     */
+    )
+  }, {
+    key: "loadFallbackSkybox",
+    value: (function () {
+      var _loadFallbackSkybox = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee7(pmremGenerator) {
+        var component, texture, processedEnvMap, _t8;
+        return _regenerator().w(function (_context0) {
+          while (1) switch (_context0.n) {
+            case 0:
+              component = this.sceneViewer;
+              _context0.p = 1;
+              console.log('🔄 Loading fallback skybox');
+              _context0.n = 2;
+              return new Promise(function (resolve, reject) {
+                var timeout = setTimeout(function () {
+                  return reject(new Error('Timeout'));
+                }, 10000);
+                component.textureLoader.load('/skyboxes/sky_fallback.jpg', function (tex) {
+                  clearTimeout(timeout);
+                  resolve(tex);
+                }, undefined, function (err) {
+                  clearTimeout(timeout);
+                  reject(err);
+                });
+              });
+            case 2:
+              texture = _context0.v;
+              texture.mapping = THREE.EquirectangularReflectionMapping;
+              processedEnvMap = pmremGenerator.fromEquirectangular(texture).texture;
+              component.scene.environment = processedEnvMap;
+              component.scene.background = processedEnvMap;
+              texture.dispose();
+              console.log('✅ Fallback skybox loaded successfully');
+              _context0.n = 4;
+              break;
+            case 3:
+              _context0.p = 3;
+              _t8 = _context0.v;
+              console.warn('⚠️ Failed to load fallback skybox:', _t8.message);
+              throw _t8;
+            case 4:
+              return _context0.a(2);
+          }
+        }, _callee7, this, [[1, 3]]);
+      }));
+      function loadFallbackSkybox(_x3) {
+        return _loadFallbackSkybox.apply(this, arguments);
+      }
+      return loadFallbackSkybox;
+    }()
+    /**
+     * Set solid color background
+     */
+    )
+  }, {
+    key: "setColorBackground",
+    value: function setColorBackground() {
+      var component = this.sceneViewer;
+      component.scene.environment = null;
+      component.scene.background = new THREE.Color(0xffffff); // White background
+
+      // Add basic ambient lighting since we don't have environment lighting
+      var ambientLight = new THREE.AmbientLight(0xffffff, 0.6);
+      component.scene.add(ambientLight);
+      console.log('✅ Color background set successfully');
+    }
+  }]);
+}();
+
+export { EnvironmentManager };