How redwan786/houses-from-outside works
This is a browser-based Three.js architectural scene: users navigate a five-storey building and cottage, inspect changing materials, and control lighting, seasons, wind, and snapshots. The runtime entry point assembles textures, lighting, environment, house models, controls, and HUD, then renders the scene. The graph preserves those distinct scene domains and the shader/material layer. Wiring is based on the README and sampled excerpts; unsampled render-loop and setup details are represented only where documented.
Main entry points: main.js Scene entry · materials.js Shader materials · lighting.js Lighting rig · cottage.js Gabled cottage
Components 13
Scene runtime
- Page shell
index.html - Scene entry
js/main.js
Scene domains
- Five-storey building
js/building.js - Gabled cottage
js/cottage.js - Scene environment
js/environment.js - Lighting rig
js/lighting.js
Rendering resources
- Texture library
js/textures.js - Shader materials
js/materials.js - GLSL programs
js/shaders.js - Texture images
assets/textures
User interaction
- Camera controls
js/controls.js - HUD
js/hud.js
Other components
- Viewer
Connections 26
- Viewer → Page shell: opens scene
- Page shell → Scene entry: loads module
- Viewer → Camera controls: navigates camera
- Viewer → Scene entry: clicks cottage
- Viewer → HUD: uses overlay
- Scene entry → Camera controls: creates and updates
- Scene entry → HUD: creates and updates
- HUD → Scene entry: dispatches actions
- Scene entry → Texture library: loads textures
- Texture library → Texture images: loads images
- Scene entry → Lighting rig: creates rig
- Scene entry → Scene environment: builds scene
- Scene entry → Five-storey building: builds model
- Scene entry → Gabled cottage: builds model
- Scene entry → Gabled cottage: updates skin
- Scene entry → Scene environment: sets season and wind
- Scene entry → Lighting rig: controls time and shadows
- Five-storey building → Shader materials: creates facade materials
- Gabled cottage → Shader materials: creates cottage materials
- Gabled cottage → Shader materials: creates smoke material
- Scene environment → Shader materials: creates foliage and glow
- Shader materials → GLSL programs: uses GLSL
- Texture library → Shader materials: supplies maps
- Lighting rig → Scene environment: shares light uniforms
- Lighting rig → Five-storey building: shares light uniforms
- Lighting rig → Gabled cottage: shares light uniforms