Please wait while we load the game details.
# Plutus Three.js Environment 4 (halloween_night style) Scene, lighting, linear fog, ground, graveyard, arch, graves (GLB models). Loads assets from `public/gameAssets.json`. Extracted from halloween_night_3d. Dark spooky graveyard atmosphere. Requires Three.js `>= 0.150.0`, ES modules. **Install:** `npm install three`. Build: `cd environment4 && npm run build`. Preview: `npm run dev`. --- ## How it works (overview) **Flow:** `gameAssets.json` lists asset IDs and URLs. The loader fetches that file, then loads the GLB models and textures from those URLs. The map builder adds ground, graveyard, arch, skull posts, and graves to the scene, applies the texture, and sets the environment cube map for reflections. **Two ways to use it:** - **Procedural** – `createEnvironment()` / `createArenaMap()` – no assets, just colored planes and boxes. Fast, but plain. - **GLB-based** – `createEnvironmentAsync()` / `createArenaMapAsync()` – loads from `gameAssets.json`, uses real models. Slower, better-looking. **Scene** is a normal `THREE.Scene` – add your own meshes with `scene.add(mesh)`. The map returns an `update(dt)` function for any per-frame logic (e.g. particle systems). **To change assets:** Edit `public/gameAssets.json` – each key is an ID, each value is a URL. Swap URLs or add new entries and use them in `loadAssets.ts`. --- ## Use in your project ```ts import { createEnvironment, createEnvironmentAsync, createArenaMapAsync } from 'plutus-threejs-environment4'; // Full environment (procedural fallback, no GLB) const { scene, lighting, map } = createEnvironment({ addMap: true, mapOptions: { ground: true, graves: true } }); // With GLB assets from gameAssets.json const { scene, lighting, map } = await createEnvironmentAsync({ addMap: true, mapOptions: { ground: true, graves: true } }); // Or modular const { scene } = createScene({ backgroundColor: 0x1a1a2e, fog: { type: 'linear', color: 0x1a1a2e, near: 5, far: 80 } }); createLighting(scene); scene.add(yourMesh); ``` --- ## Run the app ```bash cd environment4 npm install npm run dev ``` --- ## Layout | File | Purpose | |------|---------| | `index.ts` | API + `createEnvironment()` | | `types.ts` | SceneOptions, LightingOptions, MapOptions | | `config.ts` | EnvConfig (halloween: dark bg, fog, dim ambient, directional, ground/grave colors) | | `createScene.ts` | Scene, background, THREE.Fog (linear) | | `createLighting.ts` | Ambient + directional, shadows | | `map.ts` | createGround, createGraves, createArenaMap, createArenaMapAsync, createArenaMapFromAssets | | `loadAssets.ts` | fetchGameAssets, loadEnvironmentAssets | | `main.ts` | Demo entry (OrbitControls, loads GLB from gameAssets.json) | | `public/gameAssets.json` | Asset IDs and CDN URLs for ground, graveyard, arch, graves, texture, env map | --- ## How to change things | What to change | Where to look | |----------------|---------------| | Asset URLs (GLB, textures) | `public/gameAssets.json` | | Background, fog color | `createScene({ backgroundColor, fog })` or `config.ts` | | Lighting (brightness, shadows) | `createLighting(scene, { shadows, shadowMapSize })` or `config.ts` | | Map parts (ground, graves) | `mapOptions: { ground, graves }` | | Model positions | `config.ts` → EnvConfig.environment |