math-pixel/La-Fabrik
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat: add chunked grass and organize environment systems

Browse Source
This commit is contained in:
Tom Boullay
2026-05-28 00:07:02 +02:00
parent b1fca3a25b
commit 0230795f55
7 changed files with 565 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/world/Environment.tsx
+12 -42
View File
@@ -1,6 +1,3 @@
import { useMemo } from "react";
import { useFrame, useThree } from "@react-three/fiber";
import * as THREE from "three";
import {
GAME_SCENE_FALLBACK_BACKGROUND_COLOR,
GAME_SCENE_FALLBACK_SKY_MODEL_PATH,
@@ -9,46 +6,25 @@ import {
GAME_SCENE_SKY_MODEL_SCALE,
PHYSICS_SCENE_BACKGROUND_COLOR,
} from "@/data/world/environmentConfig";
import { FOG_LIGHTING_COLOR_MIX } from "@/data/world/fogConfig";
import { useCameraMode } from "@/hooks/debug/useCameraMode";
import { useSceneMode } from "@/hooks/debug/useSceneMode";
import { useFogSettings } from "@/hooks/world/useFogSettings";
import {
isMapModelVisible,
useMapPerformanceStore,
} from "@/managers/stores/useMapPerformanceStore";
import { SkyModel } from "@/components/three/world/SkyModel";
import { useDebugStore } from "@/hooks/debug/useDebugStore";
import { LIGHTING_STATE } from "@/world/lightingState";
const tempSunFogColor = new THREE.Color();
function getLightingFogColor(target: THREE.Color): THREE.Color {
target.set(LIGHTING_STATE.ambientColor);
target.multiplyScalar(FOG_LIGHTING_COLOR_MIX.ambient);
tempSunFogColor.set(LIGHTING_STATE.sunColor);
target.add(tempSunFogColor.multiplyScalar(FOG_LIGHTING_COLOR_MIX.sun));
return target;
}
import { CloudSystem } from "@/world/clouds/CloudSystem";
import { FogSystem } from "@/world/fog/FogSystem";
import { GrassSystem } from "@/world/grass/GrassSystem";
import { VegetationSystem } from "@/world/vegetation/VegetationSystem";
import { WaterSystem } from "@/world/water/WaterSystem";
import { WorldPlane } from "@/world/WorldPlane";
export function Environment(): React.JSX.Element {
const cameraMode = useCameraMode();
const sceneMode = useSceneMode();
const fog = useFogSettings();
const fogEnabled = useDebugStore((debug) => debug.getFogEnabled());
const groups = useMapPerformanceStore((state) => state.groups);
const models = useMapPerformanceStore((state) => state.models);
const scene = useThree((state) => state.scene);
const fogColor = useMemo(() => getLightingFogColor(new THREE.Color()), []);
const showSky = isMapModelVisible("sky", { groups, models });
useFrame(() => {
if (!scene.fog) return;
getLightingFogColor(scene.fog.color);
});
if (sceneMode === "physics") {
return (
<color attach="background" args={[PHYSICS_SCENE_BACKGROUND_COLOR]} />
@@ -57,18 +33,7 @@ export function Environment(): React.JSX.Element {
return (
<>
{fogEnabled &&
sceneMode === "game" &&
cameraMode === "player" &&
fog.mode === "linear" ? (
<fog attach="fog" args={[fogColor, fog.near, fog.far]} />
) : null}
{fogEnabled &&
sceneMode === "game" &&
cameraMode === "player" &&
fog.mode === "exp2" ? (
<fogExp2 attach="fog" args={[fogColor, fog.density]} />
) : null}
<FogSystem />
{showSky ? (
<SkyModel
fallbackColor={GAME_SCENE_FALLBACK_BACKGROUND_COLOR}
@@ -83,6 +48,11 @@ export function Environment(): React.JSX.Element {
args={[GAME_SCENE_FALLBACK_BACKGROUND_COLOR]}
/>
)}
<WorldPlane />
<WaterSystem />
<CloudSystem />
<GrassSystem />
<VegetationSystem />
</>
);
}