Please wait while we load the game details.
# Plutus Three.js Environment (README for AI) Scene, lighting, fog, optional dungeon map. `scene` is a normal `THREE.Scene` — use `scene.add(mesh)` for your objects. Requires Three.js `>= 0.150.0`, ES modules. **Install:** `npm install three` (+ local path if needed). Build: `cd environment1 && npm run build`. **Preview:** `npm run dev` → open URL. --- ## Use in your project Import from the package (or from `environment1` path / `dist` after build): ```ts import { createEnvironment, createScene, createLighting, createDungeonMap } from 'plutus-threejs-environment'; import * as THREE from 'three'; // Option 1: Full environment (scene + lighting + map) — same as the app entry const { scene, lighting, map } = createEnvironment({ addMap: true, mapOptions: { ground: true, walls: true, groundFog: true, centerGlow: true, decorations: true }, }); // In your game loop: // map.update(dt); // lighting.setPlayerLightPosition(playerX, 4, playerZ); // renderer.render(scene, camera); // Option 2: Modular — scene only, or scene + lighting, or add map yourself const { scene } = createScene({ backgroundColor: 0x252535, fog: { type: 'exp2', color: 0x252535, density: 0.008 } }); const { setPlayerLightPosition } = createLighting(scene); // Optional: createDungeonMap(scene, mapOptions) and use its update/isValidPosition/getObstacles // Add your own objects to the scene const box = new THREE.Mesh(new THREE.BoxGeometry(1, 1, 1), new THREE.MeshStandardMaterial({ color: 0xff0000 })); scene.add(box); ``` Collision when using map: `map.isValidPosition(x, z)` and `map.getObstacles()`. --- ## Run the app From the `environment1` folder: ```bash npm install npm run dev ``` Open the URL (http://localhost:3000). The app uses `createEnvironment({ addMap: true })`, a fixed orthographic camera, and moves the “player” light in a circle. All source is in `src/`; the app entry is `src/main.ts` and imports from `./index.js` (this package’s API). --- ## Layout (7 files in `src/`) | File | Purpose | |------|--------| | `index.ts` | API re-exports + `createEnvironment()` | | `types.ts` | SceneOptions, LightingOptions, MapOptions, etc. | | `config.ts` | EnvConfig (fog, performance, lighting, map) + Theme, getTheme() | | `createScene.ts` | Scene, background, FogExp2 | | `createLighting.ts` | All lights; returns `setPlayerLightPosition` | | `map.ts` | createGround, createBrickWalls, createGroundFog, createObstacles, createDecorations, createDungeonMap | | `main.ts` | App entry (scene, camera, renderer, game loop — build on this) | --- ## How to change the environment | Change | Where | |--------|--------| | Background/fog color (per run) | `getTheme().setBackground({ scene, fog })` before create. Defaults: `config.ts` → defaultBackground / defaultEnvironment | | Fog density, default background | `config.ts` → EnvConfig.fog.*, EnvConfig.background.scene | | Lighting (colors, intensity, shadows) | Call: `createLighting(scene, { shadows, simplified, cornerLights, playerLightColor, ... })`. Defaults: `config.ts` → EnvConfig.lighting.* | | Map size, wall/ground sizes | `config.ts` → EnvConfig.map.*. Or `mapOptions: { gridSize, cellSize, lowDetail, obstacleCount }` | | Ground look (colors, center glow) | `map.ts` → createGround. Disable glow: `mapOptions: { centerGlow: false }` | | Walls (layout, brick colors) | `config.ts` → EnvConfig.map.brickColors. Layout: `map.ts` → createBrickWalls. Transparency: `map.setWallOpacity(i, opacity)` / `map.resetAllWallOpacity()` | | Fog count/size/opacity | `map.ts` → createGroundFog. Or `mapOptions.lowDetail` | | Obstacles (count, size) | `mapOptions.obstacleCount`. Defaults: `map.ts` → createObstacles | | Decorations | `map.ts` → createDecorations | | New option/feature | Add to `types.ts`; use in create*; add default in `config.ts` if needed | **Rules:** One env per scene. With map, call `map.update(dt)` every frame. From source: run `npm run build`.