import * as THREE from 'three'; import { edgeTable, triTable } from './marchingCubesConstants.js'; export class TerrainSystem { constructor(scene, CSS2DObject) { this.scene = scene; this.CSS2DObject = CSS2DObject; this.terrainMesh = null; // Will hold the single Marching Cubes mesh this.debugLabelGroup = new THREE.Group(); this.scene.add(this.debugLabelGroup); this.destroyingChunks = []; // For particle effects, can be reused or adapted // Marching Cubes parameters this.isoLevel = 0.55; // Threshold for surface generation (was 0.5) this.gridSize = new THREE.Vector3(32, 24, 32); // Increased Y resolution for smoother terrain this.cellSize = new THREE.Vector3(1, 1, 1); // Size of each cell in world units this.scalarField = []; // 3D array to store density values // Terrain generation parameters (can be adapted for scalar field) this.maxHeight = 12; // Still useful for guiding terrain shape this.initializeScalarField(); } initializeScalarField() { this.scalarField = new Array(this.gridSize.x); for (let i = 0; i < this.gridSize.x; i++) { this.scalarField[i] = new Array(this.gridSize.y); for (let j = 0; j < this.gridSize.y; j++) { this.scalarField[i][j] = new Array(this.gridSize.z).fill(0); } } // Populate scalar field with initial terrain data for (let x = 0; x < this.gridSize.x; x++) { for (let y = 0; y < this.gridSize.y; y++) { for (let z = 0; z < this.gridSize.z; z++) { const worldX = (x - this.gridSize.x / 2) * this.cellSize.x; const worldY = y * this.cellSize.y; const worldZ = (z - this.gridSize.z / 2) * this.cellSize.z; // Base density from height (creates the ground) const groundFactor = 1.0 - (worldY / (this.maxHeight * this.cellSize.y)); let density = Math.max(0, groundFactor * 0.9) + 0.10; // Add 3D noise to create caves and overhangs. // This adds or subtracts density in a 3D pattern. const noise3D = (Math.sin(worldX * 0.2) * Math.cos(worldY * 0.4) * Math.sin(worldZ * 0.2)) * 0.5; density += noise3D; const clampedDensity = THREE.MathUtils.clamp(density, 0, 1); // Invert density: Marching Cubes considers values < isoLevel as solid. // We want high original density (solid) to result in low scalar field values. this.scalarField[x][y][z] = 1.0 - clampedDensity; } } } } getScalarField(x, y, z) { if (x < 0 || x >= this.gridSize.x || y < 0 || y >= this.gridSize.y || z < 0 || z >= this.gridSize.z) { // Out-of-bounds should be air. // Since solid is value < isoLevel (0.5), air should be >= 0.5. // A value of 1.0 ensures it's air. return 1.0; } return this.scalarField[x][y][z]; } mapGridToWorld(ix, iy, iz) { return new THREE.Vector3( (ix - this.gridSize.x / 2) * this.cellSize.x, iy * this.cellSize.y, (iz - this.gridSize.z / 2) * this.cellSize.z ); } interpolateVertex(p1, p2, val1, val2) { if (Math.abs(this.isoLevel - val1) < 0.00001) return p1.clone(); if (Math.abs(this.isoLevel - val2) < 0.00001) return p2.clone(); if (Math.abs(val1 - val2) < 0.00001) return p1.clone(); let t = (this.isoLevel - val1) / (val2 - val1); // Clamp t to the [0, 1] range. This prevents extrapolation if val1 and val2 // are on the same side of isoLevel, which can cause spikes. t = Math.max(0, Math.min(1, t)); return p1.clone().lerp(p2, t); } getGradient(ix, iy, iz) { // Using central differences to approximate the gradient of the scalar field // The gradient points from low density to high density. // Since our scalar field is 1.0 - density, the gradient points 'out' of the solid material. const gradX = this.getScalarField(ix + 1, iy, iz) - this.getScalarField(ix - 1, iy, iz); const gradY = this.getScalarField(ix, iy + 1, iz) - this.getScalarField(ix, iy - 1, iz); const gradZ = this.getScalarField(ix, iy, iz + 1) - this.getScalarField(ix, iy, iz - 1); return new THREE.Vector3(gradX, gradY, gradZ).normalize(); } createDebugLabel(text, position) { const div = document.createElement('div'); div.className = 'debug-label'; div.textContent = text; const label = new this.CSS2DObject(div); label.position.copy(position); this.debugLabelGroup.add(label); } generateTerrain(enableDebug = false) { this.debugLabelGroup.clear(); // If not already initialized by constructor (e.g. on subsequent calls for updates) if (this.scalarField.length === 0 || this.scalarField[0].length === 0) { this.initializeScalarField(); } const vertices = []; const vertexCache = new Map(); // Cache to store interpolated vertices and avoid seams const cornerValues = new Array(8); const cornerPositions = new Array(8); const cornerGradients = new Array(8); for (let i = 0; i < this.gridSize.x - 1; i++) { for (let j = 0; j < this.gridSize.y - 1; j++) { for (let k = 0; k < this.gridSize.z - 1; k++) { const edgeVertices = new Array(12); // Get scalar values for the 8 corners of the current cell cornerValues[0] = this.getScalarField(i, j, k); cornerValues[1] = this.getScalarField(i + 1, j, k); cornerValues[2] = this.getScalarField(i + 1, j, k + 1); cornerValues[3] = this.getScalarField(i, j, k + 1); cornerValues[4] = this.getScalarField(i, j + 1, k); cornerValues[5] = this.getScalarField(i + 1, j + 1, k); cornerValues[6] = this.getScalarField(i + 1, j + 1, k + 1); cornerValues[7] = this.getScalarField(i, j + 1, k + 1); cornerGradients[0] = this.getGradient(i, j, k); cornerGradients[1] = this.getGradient(i + 1, j, k); cornerGradients[2] = this.getGradient(i + 1, j, k + 1); cornerGradients[3] = this.getGradient(i, j, k + 1); cornerGradients[4] = this.getGradient(i, j + 1, k); cornerGradients[5] = this.getGradient(i + 1, j + 1, k); cornerGradients[6] = this.getGradient(i + 1, j + 1, k + 1); cornerGradients[7] = this.getGradient(i, j + 1, k + 1); // Calculate cube index let cubeIndex = 0; if (cornerValues[0] < this.isoLevel) cubeIndex |= 1; if (cornerValues[1] < this.isoLevel) cubeIndex |= 2; if (cornerValues[2] < this.isoLevel) cubeIndex |= 4; if (cornerValues[3] < this.isoLevel) cubeIndex |= 8; if (cornerValues[4] < this.isoLevel) cubeIndex |= 16; if (cornerValues[5] < this.isoLevel) cubeIndex |= 32; if (cornerValues[6] < this.isoLevel) cubeIndex |= 64; if (cornerValues[7] < this.isoLevel) cubeIndex |= 128; // If cube is entirely inside or outside, no surface if (edgeTable[cubeIndex] === 0) continue; // Get world positions for the 8 corners cornerPositions[0] = this.mapGridToWorld(i, j, k); cornerPositions[1] = this.mapGridToWorld(i + 1, j, k); cornerPositions[2] = this.mapGridToWorld(i + 1, j, k + 1); cornerPositions[3] = this.mapGridToWorld(i, j, k + 1); cornerPositions[4] = this.mapGridToWorld(i, j + 1, k); cornerPositions[5] = this.mapGridToWorld(i + 1, j + 1, k); cornerPositions[6] = this.mapGridToWorld(i + 1, j + 1, k + 1); cornerPositions[7] = this.mapGridToWorld(i, j + 1, k + 1); // This function checks the cache or computes, stores, and returns a new vertex. // This function checks the cache or computes, stores, and returns a new vertex. const getEdgeVertex = (p1_idx, p2_idx, c1_coords, c2_coords) => { // Create a unique integer key for the edge based on its corner indices. // Order indices to ensure the key is the same regardless of direction. const idx1 = c1_coords.x + this.gridSize.x * (c1_coords.y + this.gridSize.y * c1_coords.z); const idx2 = c2_coords.x + this.gridSize.x * (c2_coords.y + this.gridSize.y * c2_coords.z); const key = Math.min(idx1, idx2) + '_' + Math.max(idx1, idx2); if (vertexCache.has(key)) { return vertexCache.get(key); } const val1 = cornerValues[p1_idx]; const val2 = cornerValues[p2_idx]; const t = (this.isoLevel - val1) / (val2 - val1); const vertex = cornerPositions[p1_idx].clone().lerp(cornerPositions[p2_idx], t); vertexCache.set(key, vertex); return vertex; }; const coords = [ {x: i, y: j, z: k}, {x: i + 1, y: j, z: k}, {x: i + 1, y: j, z: k + 1}, {x: i, y: j, z: k + 1}, {x: i, y: j + 1, z: k}, {x: i + 1, y: j + 1, z: k}, {x: i + 1, y: j + 1, z: k + 1}, {x: i, y: j + 1, z: k + 1} ]; // Calculate intersection points on edges if (edgeTable[cubeIndex] & 1) edgeVertices[0] = getEdgeVertex(0, 1, coords[0], coords[1]); if (edgeTable[cubeIndex] & 2) edgeVertices[1] = getEdgeVertex(1, 2, coords[1], coords[2]); if (edgeTable[cubeIndex] & 4) edgeVertices[2] = getEdgeVertex(2, 3, coords[2], coords[3]); if (edgeTable[cubeIndex] & 8) edgeVertices[3] = getEdgeVertex(3, 0, coords[3], coords[0]); if (edgeTable[cubeIndex] & 16) edgeVertices[4] = getEdgeVertex(4, 5, coords[4], coords[5]); if (edgeTable[cubeIndex] & 32) edgeVertices[5] = getEdgeVertex(5, 6, coords[5], coords[6]); if (edgeTable[cubeIndex] & 64) edgeVertices[6] = getEdgeVertex(6, 7, coords[6], coords[7]); if (edgeTable[cubeIndex] & 128) edgeVertices[7] = getEdgeVertex(7, 4, coords[7], coords[4]); if (edgeTable[cubeIndex] & 256) edgeVertices[8] = getEdgeVertex(0, 4, coords[0], coords[4]); if (edgeTable[cubeIndex] & 512) edgeVertices[9] = getEdgeVertex(1, 5, coords[1], coords[5]); if (edgeTable[cubeIndex] & 1024) edgeVertices[10] = getEdgeVertex(2, 6, coords[2], coords[6]); if (edgeTable[cubeIndex] & 2048) edgeVertices[11] = getEdgeVertex(3, 7, coords[3], coords[7]); // Create triangles for (let tri = 0; triTable[cubeIndex][tri] !== -1; tri += 3) { const vIndex1 = triTable[cubeIndex][tri]; const vIndex2 = triTable[cubeIndex][tri + 1]; const vIndex3 = triTable[cubeIndex][tri + 2]; const v1 = edgeVertices[vIndex1]; const v2 = edgeVertices[vIndex2]; const v3 = edgeVertices[vIndex3]; if (enableDebug && i === 15 && j === 10 && k === 15) { this.createDebugLabel(`C: ${cubeIndex}`, this.mapGridToWorld(i + 0.5, j + 0.5, k + 0.5)); for(let corner=0; corner<8; corner++) { this.createDebugLabel(`v${corner}:${cornerValues[corner].toFixed(2)}`, cornerPositions[corner]); } for(let edge=0; edge<12; edge++) { if(edgeVertices[edge]) { const sphereGeo = new THREE.SphereGeometry(0.05, 8, 8); const sphereMat = new THREE.MeshBasicMaterial({ color: 0xff00ff }); const sphereMesh = new THREE.Mesh(sphereGeo, sphereMat); sphereMesh.position.copy(edgeVertices[edge]); this.debugLabelGroup.add(sphereMesh); } } } if (v1 && v2 && v3) { // The triTable provides the correct winding order. vertices.push(v1.x, v1.y, v1.z); vertices.push(v2.x, v2.y, v2.z); vertices.push(v3.x, v3.y, v3.z); } else { // This can happen if triTable refers to an edge that edgeTable didn't mark. // Or if an edge vertex wasn't calculated due to some condition. // console.warn(`Skipping triangle due to undefined vertex for cubeIndex ${cubeIndex}: vIndices ${vIndex1}, ${vIndex2}, ${vIndex3}`); } } } } } if (this.terrainMesh) { this.scene.remove(this.terrainMesh); this.terrainMesh.geometry.dispose(); this.terrainMesh.material.dispose(); } if (vertices.length === 0) { this.terrainMesh = null; // No geometry to create console.log("Marching Cubes: No vertices generated."); return; } const geometry = new THREE.BufferGeometry(); geometry.setAttribute('position', new THREE.Float32BufferAttribute(vertices, 3)); geometry.computeVertexNormals(); const material = new THREE.MeshStandardMaterial({ // color: 0x4CAF50, // Base color will be set by onBeforeCompile roughness: 0.8, metalness: 0.1, side: THREE.DoubleSide // IMPORTANT: Process both sides for front/back coloring }); material.onBeforeCompile = shader => { shader.uniforms.frontColor = { value: new THREE.Color(0x4CAF50) }; // Green for front shader.uniforms.backColor = { value: new THREE.Color(0x5D4037) }; // Dark brown for "earth" shader.fragmentShader = ` uniform vec3 frontColor; uniform vec3 backColor; ` + shader.fragmentShader; shader.fragmentShader = shader.fragmentShader.replace( '#include ', ` #include if (gl_FrontFacing) { diffuseColor.rgb = frontColor; } else { diffuseColor.rgb = backColor; } ` ); }; this.terrainMesh = new THREE.Mesh(geometry, material); this.terrainMesh.castShadow = true; this.terrainMesh.receiveShadow = true; this.scene.add(this.terrainMesh); // The mesh vertices are already in world space, so no need to position the mesh itself. console.log("Marching Cubes terrain generation complete. Vertices:", vertices.length / 3); } generateDebugCube() { if (this.terrainMesh) { this.scene.remove(this.terrainMesh); this.terrainMesh.geometry.dispose(); this.terrainMesh.material.dispose(); } const vertices = []; const numConfigs = 256; const gridDim = 16; // 16x16 grid // Define the 12 edge vertex positions for a unit cube. // We use the midpoints of the edges, so no interpolation is needed. const edgeVertexPositions = [ new THREE.Vector3(0.5, 0, 0), // Edge 0 new THREE.Vector3(1, 0, 0.5), // Edge 1 new THREE.Vector3(0.5, 0, 1), // Edge 2 new THREE.Vector3(0, 0, 0.5), // Edge 3 new THREE.Vector3(0.5, 1, 0), // Edge 4 new THREE.Vector3(1, 1, 0.5), // Edge 5 new THREE.Vector3(0.5, 1, 1), // Edge 6 new THREE.Vector3(0, 1, 0.5), // Edge 7 new THREE.Vector3(0, 0.5, 0), // Edge 8 new THREE.Vector3(1, 0.5, 0), // Edge 9 new THREE.Vector3(1, 0.5, 1), // Edge 10 new THREE.Vector3(0, 0.5, 1) // Edge 11 ]; for (let cubeIndex = 0; cubeIndex < numConfigs; cubeIndex++) { const gridX = cubeIndex % gridDim; const gridZ = Math.floor(cubeIndex / gridDim); // Position each configuration in a grid const offset = new THREE.Vector3( (gridX - gridDim / 2) * 1.5, 0, (gridZ - gridDim / 2) * 1.5 ); const triangleList = triTable[cubeIndex]; for (let i = 0; triangleList[i] !== -1; i += 3) { const v1 = edgeVertexPositions[triangleList[i]].clone().add(offset); const v2 = edgeVertexPositions[triangleList[i+1]].clone().add(offset); const v3 = edgeVertexPositions[triangleList[i+2]].clone().add(offset); vertices.push(v1.x, v1.y, v1.z, v2.x, v2.y, v2.z, v3.x, v3.y, v3.z); } } const geometry = new THREE.BufferGeometry(); geometry.setAttribute('position', new THREE.Float32BufferAttribute(vertices, 3)); geometry.computeVertexNormals(); const material = new THREE.MeshStandardMaterial({ color: 0x4CAF50, roughness: 0.8, metalness: 0.1, side: THREE.DoubleSide }); this.terrainMesh = new THREE.Mesh(geometry, material); this.scene.add(this.terrainMesh); console.log(`Generated debug cube with ${vertices.length / 3} vertices.`); } destroyChunkAt(worldPosition) { // For Marching Cubes, destruction means modifying the scalar field // and regenerating the affected part of the mesh. // This is a simplified placeholder for now. // Convert world position to grid coordinates const gridX = Math.floor((worldPosition.x / this.cellSize.x) + this.gridSize.x / 2); const gridY = Math.floor(worldPosition.y / this.cellSize.y); const gridZ = Math.floor((worldPosition.z / this.cellSize.z) + this.gridSize.z / 2); const radius = 3; // Radius of destruction in grid units let changed = false; for (let dx = -radius; dx <= radius; dx++) { for (let dy = -radius; dy <= radius; dy++) { for (let dz = -radius; dz <= radius; dz++) { const effectedX = gridX + dx; const effectedY = gridY + dy; const effectedZ = gridZ + dz; if ( effectedX >= 0 && effectedX < this.gridSize.x && effectedY >= 0 && effectedY < this.gridSize.y && effectedZ >= 0 && effectedZ < this.gridSize.z ) { // Check distance for a spherical destruction if (dx*dx + dy*dy + dz*dz <= radius*radius) { // Set scalar field to represent air (value >= isoLevel, e.g., 1.0) // Original: 0 (which meant solid, clampedDensity = 1.0) this.scalarField[effectedX][effectedY][effectedZ] = 1.0; changed = true; } } } } } if (changed) { console.log(`Destroying terrain around grid cell: ${gridX}, ${gridY}, ${gridZ}`); this.createDestructionParticles(worldPosition); // Keep particles for now // TODO: Regenerate the terrain mesh after modifying scalar field this.generateTerrain(); // Full regeneration for now, optimize later } } startChunkDestruction(chunk) { // This method is less relevant with a single mesh. // Particle effects will be handled by createDestructionParticles. // The old chunk mesh removal is not needed. this.createDestructionParticles(chunk.position); // if chunk represents a point } createDestructionParticles(position) { const particleCount = 8; const particleGeometry = new THREE.BoxGeometry(0.2 * this.cellSize.x, 0.2 * this.cellSize.y, 0.2 * this.cellSize.z); for (let i = 0; i < particleCount; i++) { const particleMaterial = new THREE.MeshLambertMaterial({ color: new THREE.Color().setHSL(0.25, 0.7, 0.3 + Math.random() * 0.4) }); const particle = new THREE.Mesh(particleGeometry, particleMaterial); particle.position.copy(position); particle.position.add(new THREE.Vector3( (Math.random() - 0.5) * 2 * this.cellSize.x, (Math.random() - 0.5) * 2 * this.cellSize.y, (Math.random() - 0.5) * 2 * this.cellSize.z )); // Add random velocity particle.velocity = new THREE.Vector3( (Math.random() - 0.5) * 8, Math.random() * 8 + 2, (Math.random() - 0.5) * 8 ); particle.life = 1.0; this.scene.add(particle); // Store for cleanup this.destroyingChunks.push({ mesh: particle, startTime: Date.now(), isParticle: true, velocity: particle.velocity }); } } update(deltaTime) { // Update destroying chunks animation (particles) for (let i = this.destroyingChunks.length - 1; i >= 0; i--) { const destroyingChunk = this.destroyingChunks[i]; const elapsed = (Date.now() - destroyingChunk.startTime) / 1000; if (destroyingChunk.isParticle) { // Update particle physics const mesh = destroyingChunk.mesh; mesh.position.add(destroyingChunk.velocity.clone().multiplyScalar(deltaTime)); destroyingChunk.velocity.y -= 15 * deltaTime; // Gravity // Fade out mesh.material.opacity = Math.max(0, 1 - elapsed * 2); mesh.material.transparent = true; if (elapsed > 2 || mesh.position.y < -10) { // Remove if fallen too far this.scene.remove(mesh); if (mesh.geometry) mesh.geometry.dispose(); if (mesh.material) mesh.material.dispose(); this.destroyingChunks.splice(i, 1); } } // Removed old chunk destruction animation logic as it's not directly applicable } } }