3D Digging Treasure Simulator

Tap/Click to dig for treasure!

Treasures: 0

import * as THREE from 'three'; import { OrbitControls } from 'three/addons/controls/OrbitControls.js'; import { VRButton } from 'three/addons/webxr/VRButton.js'; import { XRControllerModelFactory } from 'three/addons/webxr/XRControllerModelFactory.js'; import { TerrainGenerator } from './terrain.js'; import { TreasureManager } from './treasures.js'; import { ShovelTool } from './shovel.js'; import { SoundManager } from './sound.js'; import { ParticleSystem } from './particles.js'; class DiggingSimulator { constructor() { this.score = 0; this.isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent); this.isDigging = false; this.digPosition = new THREE.Vector3(); this.raycaster = new THREE.Raycaster(); this.pointer = new THREE.Vector2(); this.clock = new THREE.Clock(); this.init(); } init() { // Setup renderer this.renderer = new THREE.WebGLRenderer({ antialias: true }); this.renderer.setSize(window.innerWidth, window.innerHeight); this.renderer.setPixelRatio(window.devicePixelRatio); this.renderer.shadowMap.enabled = true; this.renderer.xr.enabled = true; document.body.appendChild(this.renderer.domElement); // Replace default VR button with custom one document.getElementById('vr-button').addEventListener('click', () => { document.body.appendChild(VRButton.createButton(this.renderer)); document.getElementById('vr-button').style.display = 'none'; }); // Setup scene this.scene = new THREE.Scene(); this.scene.background = new THREE.Color(0x87ceeb); this.scene.fog = new THREE.FogExp2(0x87ceeb, 0.01); // Setup camera this.camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000); this.camera.position.set(0, 5, 10); // Setup controls this.controls = new OrbitControls(this.camera, this.renderer.domElement); this.controls.target.set(0, 0, 0); this.controls.maxPolarAngle = Math.PI / 2 - 0.1; // Prevent going below ground this.controls.minDistance = 3; this.controls.maxDistance = 20; this.controls.update(); // Setup lights const ambientLight = new THREE.AmbientLight(0xffffff, 0.5); this.scene.add(ambientLight); const directionalLight = new THREE.DirectionalLight(0xffffff, 1); directionalLight.position.set(5, 10, 7.5); directionalLight.castShadow = true; directionalLight.shadow.mapSize.width = 2048; directionalLight.shadow.mapSize.height = 2048; directionalLight.shadow.camera.near = 0.5; directionalLight.shadow.camera.far = 50; directionalLight.shadow.camera.left = -20; directionalLight.shadow.camera.right = 20; directionalLight.shadow.camera.top = 20; directionalLight.shadow.camera.bottom = -20; this.scene.add(directionalLight); // Initialize systems this.terrainGenerator = new TerrainGenerator(this.scene); this.treasureManager = new TreasureManager(this.scene, this.terrainGenerator); this.shovelTool = new ShovelTool(this.scene, this.camera); this.soundManager = new SoundManager(); this.particleSystem = new ParticleSystem(this.scene); // Setup VR controllers this.setupVRControllers(); // Add event listeners window.addEventListener('resize', this.onWindowResize.bind(this)); window.addEventListener('pointerdown', this.onPointerDown.bind(this)); window.addEventListener('pointermove', this.onPointerMove.bind(this)); window.addEventListener('pointerup', this.onPointerUp.bind(this)); // Start animation loop this.renderer.setAnimationLoop(this.animate.bind(this)); } setupVRControllers() { this.controller1 = this.renderer.xr.getController(0); this.controller1.addEventListener('selectstart', this.onControllerSelectStart.bind(this)); this.controller1.addEventListener('selectend', this.onControllerSelectEnd.bind(this)); this.scene.add(this.controller1); this.controller2 = this.renderer.xr.getController(1); this.controller2.addEventListener('selectstart', this.onControllerSelectStart.bind(this)); this.controller2.addEventListener('selectend', this.onControllerSelectEnd.bind(this)); this.scene.add(this.controller2); const controllerModelFactory = new XRControllerModelFactory(); this.controllerGrip1 = this.renderer.xr.getControllerGrip(0); this.controllerGrip1.add(controllerModelFactory.createControllerModel(this.controllerGrip1)); this.scene.add(this.controllerGrip1); this.controllerGrip2 = this.renderer.xr.getControllerGrip(1); this.controllerGrip2.add(controllerModelFactory.createControllerModel(this.controllerGrip2)); this.scene.add(this.controllerGrip2); } onControllerSelectStart(event) { const controller = event.target; const tempMatrix = new THREE.Matrix4(); tempMatrix.identity().extractRotation(controller.matrixWorld); this.raycaster.ray.origin.setFromMatrixPosition(controller.matrixWorld); this.raycaster.ray.direction.set(0, 0, -1).applyMatrix4(tempMatrix); this.checkDigging(controller); } onControllerSelectEnd() { this.isDigging = false; } onWindowResize() { this.camera.aspect = window.innerWidth / window.innerHeight; this.camera.updateProjectionMatrix(); this.renderer.setSize(window.innerWidth, window.innerHeight); } onPointerDown(event) { this.pointer.x = (event.clientX / window.innerWidth) * 2 - 1; this.pointer.y = -(event.clientY / window.innerHeight) * 2 + 1; this.isDigging = true; this.checkDigging(); } onPointerMove(event) { this.pointer.x = (event.clientX / window.innerWidth) * 2 - 1; this.pointer.y = -(event.clientY / window.innerHeight) * 2 + 1; if (this.isDigging) { this.checkDigging(); } } onPointerUp() { this.isDigging = false; } checkDigging(controller = null) { if (controller) { // VR controller digging const intersects = this.raycaster.intersectObject(this.terrainGenerator.terrain); if (intersects.length > 0) { this.dig(intersects[0].point); } } else { // Mouse/touch digging this.raycaster.setFromCamera(this.pointer, this.camera); const intersects = this.raycaster.intersectObject(this.terrainGenerator.terrain); if (intersects.length > 0) { this.dig(intersects[0].point); } } } dig(position) { this.digPosition.copy(position); // Modify terrain at dig position const modified = this.terrainGenerator.modifyTerrain(position); if (modified) { // Play digging sound this.soundManager.playDigSound(); // Show particles this.particleSystem.createDirtParticles(position); // Check if we found treasure const treasureFound = this.treasureManager.checkTreasure(position); if (treasureFound) { this.score++; document.getElementById('score').textContent = `Treasures: ${this.score}`; this.soundManager.playTreasureSound(); this.particleSystem.createTreasureParticles(position); } // Update shovel position this.shovelTool.updatePosition(position); } } animate() { const delta = this.clock.getDelta(); // Update controls this.controls.update(); // Update shovel animation if (this.isDigging) { this.shovelTool.animate(delta); } // Update particles this.particleSystem.update(delta); // Render scene this.renderer.render(this.scene, this.camera); } } // Initialize the application new DiggingSimulator(); import * as THREE from 'three'; import SimplexNoise from 'https://cdn.jsdelivr.net/npm/simplex-noise@2.4.0/simplex-noise.js'; export class TerrainGenerator { constructor(scene) { this.scene = scene; this.simplex = new SimplexNoise(); this.size = 50; this.resolution = 128; this.heightMap = []; this.digMarks = new Set(); this.generateTerrain(); } generateTerrain() { // Initialize height map this.heightMap = new Array(this.resolution); for (let i = 0; i < this.resolution; i++) { this.heightMap[i] = new Array(this.resolution); for (let j = 0; j < this.resolution; j++) { const x = (i / this.resolution) * this.size - this.size / 2; const z = (j / this.resolution) * this.size - this.size / 2; // Generate height using multiple octaves of noise let height = 0; height += this.simplex.noise2D(x * 0.01, z * 0.01) * 2; height += this.simplex.noise2D(x * 0.05, z * 0.05) * 0.5; height += this.simplex.noise2D(x * 0.1, z * 0.1) * 0.25; // Flatten the center area a bit const distanceFromCenter = Math.sqrt(x * x + z * z); const flatteningFactor = Math.max(0, 1 - Math.pow(distanceFromCenter / (this.size * 0.4), 2)); height = height * (1 - flatteningFactor * 0.7); this.heightMap[i][j] = height; } } // Create geometry const geometry = new THREE.PlaneGeometry( this.size, this.size, this.resolution - 1, this.resolution - 1 ); geometry.rotateX(-Math.PI / 2); // Apply height map to vertices const vertices = geometry.attributes.position.array; for (let i = 0; i < this.resolution; i++) { for (let j = 0; j < this.resolution; j++) { const index = (i * this.resolution + j) * 3 + 1; // Y component vertices[index] = this.heightMap[i][j]; } } // Update normals geometry.computeVertexNormals(); // Create material const groundTexture = new THREE.TextureLoader().load('https://threejs.org/examples/textures/terrain/grasslight-big.jpg'); groundTexture.wrapS = groundTexture.wrapT = THREE.RepeatWrapping; groundTexture.repeat.set(5, 5); const material = new THREE.MeshStandardMaterial({ map: groundTexture, roughness: 0.8, metalness: 0.1, vertexColors: true }); // Add vertex colors based on height const colors = []; for (let i = 0; i < vertices.length / 3; i++) { const y = vertices[i * 3 + 1]; // Color based on height if (y < -0.5) { // Sand colors.push(0.76, 0.7, 0.5); } else if (y < 0.5) { // Grass colors.push(0.2, 0.5, 0.1); } else if (y < 1.5) { // Rock colors.push(0.5, 0.5, 0.5); } else { // Snow colors.push(0.9, 0.9, 0.9); } } geometry.setAttribute('color', new THREE.Float32BufferAttribute(colors, 3)); // Create mesh this.terrain = new THREE.Mesh(geometry, material); this.terrain.receiveShadow = true; this.terrain.castShadow = true; this.scene.add(this.terrain); // Add a water plane below the terrain const waterGeometry = new THREE.PlaneGeometry(this.size * 1.5, this.size * 1.5); const waterMaterial = new THREE.MeshStandardMaterial({ color: 0x0077be, transparent: true, opacity: 0.7, roughness: 0.1, metalness: 0.8 }); const water = new THREE.Mesh(waterGeometry, waterMaterial); water.rotation.x = -Math.PI / 2; water.position.y = -2; this.scene.add(water); } modifyTerrain(position) { // Convert world position to grid coordinates const gridX = Math.floor((position.x + this.size / 2) / this.size * this.resolution); const gridZ = Math.floor((position.z + this.size / 2) / this.size * this.resolution); // Check if this position has already been dug const key = `${gridX},${gridZ}`; if (this.digMarks.has(key)) { return false; } // Mark as dug this.digMarks.add(key); // Radius of the dig area const radius = 3; // Modify vertices in a radius around the dig point const vertices = this.terrain.geometry.attributes.position.array; let modified = false; for (let i = Math.max(0, gridX - radius); i <= Math.min(this.resolution - 1, gridX + radius); i++) { for (let j = Math.max(0, gridZ - radius); j <= Math.min(this.resolution - 1, gridZ + radius); j++) { const distance = Math.sqrt((i - gridX) * (i - gridX) + (j - gridZ) * (j - gridZ)); if (distance <= radius) { const index = (i * this.resolution + j) * 3 + 1; // Y component const depthFactor = 1 - (distance / radius); const digDepth = 0.5 * depthFactor; // Lower the terrain at this point vertices[index] -= digDepth; modified = true; } } } if (modified) { // Update the geometry this.terrain.geometry.attributes.position.needsUpdate = true; this.terrain.geometry.computeVertexNormals(); return true; } return false; } getHeightAtPosition(x, z) { // Convert world position to grid coordinates const gridX = Math.floor((x + this.size / 2) / this.size * (this.resolution - 1)); const gridZ = Math.floor((z + this.size / 2) / this.size * (this.resolution - 1)); // Clamp to valid range const i = Math.max(0, Math.min(this.resolution - 1, gridX)); const j = Math.max(0, Math.min(this.resolution - 1, gridZ)); return this.heightMap[i][j]; } } import * as THREE from 'three'; export class TreasureManager { constructor(scene, terrainGenerator) { this.scene = scene; this.terrainGenerator = terrainGenerator; this.treasures = []; this.foundTreasures = new Set(); this.treasureModels = [ { name: 'coin', scale: 0.5, value: 1 }, { name: 'chest', scale: 0.8, value: 5 }, { name: 'gem', scale: 0.4, value: 10 } ]; this.generateTreasures(); } generateTreasures() { // Create treasure geometries const coinGeometry = new THREE.CylinderGeometry(0.5, 0.5, 0.1, 32); const chestGeometry = new THREE.BoxGeometry(1, 0.7, 0.6); const gemGeometry = new THREE.OctahedronGeometry(0.5, 2); // Create treasure materials const coinMaterial = new THREE.MeshStandardMaterial({ color: 0xffd700, metalness: 1.0, roughness: 0.2 }); const chestMaterial = new THREE.MeshStandardMaterial({ color: 0x8b4513, metalness: 0.3, roughness: 0.8 }); const gemMaterial = new THREE.MeshStandardMaterial({ color: 0x0000ff, metalness: 0.8, roughness: 0.2, transparent: true, opacity: 0.9 }); // Number of treasures to generate const treasureCount = 30; for (let i = 0; i < treasureCount; i++) { // Random position within terrain bounds const x = Math.random() * this.terrainGenerator.size - this.terrainGenerator.size / 2; const z = Math.random() * this.terrainGenerator.size - this.terrainGenerator.size / 2; // Get height at this position and bury the treasure const surfaceHeight = this.terrainGenerator.getHeightAtPosition(x, z); const burialDepth = Math.random() * 0.5 + 0.2; // Random depth between 0.2 and 0.7 const y = surfaceHeight - burialDepth; // Choose a random treasure type const treasureType = Math.floor(Math.random() * 3); let treasure; switch (treasureType) { case 0: // Coin treasure = new THREE.Mesh(coinGeometry, coinMaterial); treasure.rotation.x = Math.PI / 2; // Lay flat treasure.scale.set(0.5, 0.5, 0.5); treasure.value = 1; break; case 1: // Chest treasure = new THREE.Mesh(chestGeometry, chestMaterial); treasure.scale.set(0.8, 0.8, 0.8); treasure.value = 5; break; case 2: // Gem treasure = new THREE.Mesh(gemGeometry, gemMaterial); treasure.scale.set(0.4, 0.4, 0.4); treasure.value = 10; break; } treasure.position.set(x, y, z); treasure.castShadow = true; treasure.visible = false; // Hidden until discovered treasure.userData = { id: i, type: treasureType }; this.scene.add(treasure); this.treasures.push(treasure); } } checkTreasure(position) { const detectionRadius = 1.0; let treasureFound = false; for (const treasure of this.treasures) { // Skip already found treasures if (this.foundTreasures.has(treasure.userData.id)) { continue; } // Check distance to treasure const distance = position.distanceTo(treasure.position); if (distance < detectionRadius) { // Treasure found! treasure.visible = true; // Animate the treasure rising up this.animateTreasureDiscovery(treasure); // Mark as found this.foundTreasures.add(treasure.userData.id); treasureFound = true; } } return treasureFound; } animateTreasureDiscovery(treasure) { // Store original position const originalY = treasure.position.y; // Animate rising up const targetY = originalY + 1.0; const duration = 1.0; // seconds const startTime = performance.now(); const animate = (time) => { const elapsed = (time - startTime) / 1000; // Convert to seconds const progress = Math.min(elapsed / duration, 1.0); // Ease out cubic function const easeOut = 1 - Math.pow(1 - progress, 3); // Update position treasure.position.y = originalY + easeOut * (targetY - originalY); // Rotate the treasure treasure.rotation.y += 0.05; if (progress < 1.0) { requestAnimationFrame(animate); } }; requestAnimationFrame(animate); } } import * as THREE from 'three'; export class ShovelTool { constructor(scene, camera) { this.scene = scene; this.camera = camera; this.shovel = null; this.animationState = { digging: false, progress: 0, duration: 0.5 // seconds }; this.createShovel(); } createShovel() { // Create shovel handle const handleGeometry = new THREE.CylinderGeometry(0.05, 0.05, 1.5, 8); const handleMaterial = new THREE.MeshStandardMaterial({ color: 0x8B4513, roughness: 0.8 }); const handle = new THREE.Mesh(handleGeometry, handleMaterial); handle.position.y = 0.75; // Create shovel head const headGeometry = new THREE.BoxGeometry(0.3, 0.1, 0.4); const headMaterial = new THREE.MeshStandardMaterial({ color: 0x808080, metalness: 0.8, roughness: 0.2 }); const head = new THREE.Mesh(headGeometry, headMaterial); head.position.y = 0; head.position.z = 0.2; head.rotation.x = Math.PI / 4; // Create shovel group this.shovel = new THREE.Group(); this.shovel.add(handle); this.shovel.add(head); // Position the shovel this.shovel.position.set(0, 0, 0); this.shovel.rotation.x = Math.PI / 4; this.shovel.castShadow = true; this.scene.add(this.shovel); // Initially hide the shovel this.shovel.visible = false; } updatePosition(position) { if (!this.shovel) return; // Make shovel visible this.shovel.visible = true; // Position the shovel at the dig location this.shovel.position.copy(position); this.shovel.position.y += 0.5; // Lift slightly above ground // Orient shovel towards camera const cameraDirection = new THREE.Vector3(); this.camera.getWorldDirection(cameraDirection); cameraDirection.y = 0; // Keep shovel upright cameraDirection.normalize(); // Calculate rotation to face camera const shovelDirection = new THREE.Vector3(0, 0, 1); this.shovel.quaternion.setFromUnitVectors(shovelDirection, cameraDirection.negate()); // Start digging animation this.animationState.digging = true; this.animationState.progress = 0; } animate(delta) { if (!this.shovel || !this.animationState.digging) return; // Update animation progress this.animationState.progress += delta / this.animationState.duration; if (this.animationState.progress >= 1) { // Reset animation this.animationState.progress = 0; } // Calculate animation curve (0 to 1 to 0) const curve = Math.sin(this.animationState.progress * Math.PI); // Apply rotation animation this.shovel.rotation.x = Math.PI / 4 - curve * Math.PI / 3; // Apply position animation (shovel goes down slightly when digging) const originalY = this.shovel.position.y; this.shovel.position.y = originalY - curve * 0.3; } } export class SoundManager { constructor() { this.audioContext = null; this.sounds = { dig: null, treasure: null }; this.initAudio(); } initAudio() { // Initialize audio context on user interaction const initAudioContext = () => { if (this.audioContext) return; this.audioContext = new (window.AudioContext || window.webkitAudioContext)(); this.loadSounds(); // Remove event listeners once initialized document.removeEventListener('click', initAudioContext); document.removeEventListener('touchstart', initAudioContext); }; document.addEventListener('click', initAudioContext); document.addEventListener('touchstart', initAudioContext); } loadSounds() { // Create dig sound (synthesized) this.sounds.dig = this.createDigSound(); // Create treasure sound (synthesized) this.sounds.treasure = this.createTreasureSound(); } createDigSound() { const bufferSize = this.audioContext.sampleRate * 0.5; // 0.5 seconds const buffer = this.audioContext.createBuffer(1, bufferSize, this.audioContext.sampleRate); const data = buffer.getChannelData(0); // Create a digging sound (noise with envelope) for (let i = 0; i < bufferSize; i++) { // Time in seconds const t = i / this.audioContext.sampleRate; // Envelope (fade in and out) const envelope = Math.sin(Math.PI * t / 0.5); // Noise const noise = Math.random() * 2 - 1; // Apply envelope to noise data[i] = noise * envelope * 0.5; } return buffer; } createTreasureSound() { const bufferSize = this.audioContext.sampleRate * 1.0; // 1 second const buffer = this.audioContext.createBuffer(1, bufferSize, this.audioContext.sampleRate); const data = buffer.getChannelData(0); // Create a treasure discovery sound (ascending tones) for (let i = 0; i < bufferSize; i++) { // Time in seconds const t = i / this.audioContext.sampleRate; // Frequency increases over time (ascending tone) const frequency = 440 + t * 880; // Envelope (fade in and out) const envelope = Math.sin(Math.PI * t); // Generate tone const tone = Math.sin(2 * Math.PI * frequency * t); // Apply envelope to tone data[i] = tone * envelope * 0.5; } return buffer; } playDigSound() { if (!this.audioContext || !this.sounds.dig) return; const source = this.audioContext.createBufferSource(); source.buffer = this.sounds.dig; // Add a low-pass filter for a muffled effect const filter = this.audioContext.createBiquadFilter(); filter.type = 'lowpass'; filter.frequency.value = 800; source.connect(filter); filter.connect(this.audioContext.destination); source.start(); } playTreasureSound() { if (!this.audioContext || !this.sounds.treasure) return; const source = this.audioContext.createBufferSource(); source.buffer = this.sounds.treasure; // Add a bit of reverb for a magical effect const convolver = this.audioContext.createConvolver(); const reverbTime = 2; const reverbBuffer = this.createReverbBuffer(reverbTime); convolver.buffer = reverbBuffer; source.connect(convolver); convolver.connect(this.audioContext.destination); source.start(); } createReverbBuffer(duration) { const sampleRate = this.audioContext.sampleRate; const length = sampleRate * duration; const buffer = this.audioContext.createBuffer(2, length, sampleRate); const left = buffer.getChannelData(0); const right = buffer.getChannelData(1); for (let i = 0; i < length; i++) { const t = i / sampleRate; const decay = Math.exp(-t * 3); // Exponential decay left[i] = (Math.random() * 2 - 1) * decay; right[i] = (Math.random() * 2 - 1) * decay; } return buffer; } } import * as THREE from 'three'; export class ParticleSystem { constructor(scene) { this.scene = scene; this.particles = []; // Create materials this.dirtMaterial = new THREE.PointsMaterial({ color: 0x8B4513, size: 0.1, sizeAttenuation: true, transparent: true, opacity: 0.8 }); this.treasureMaterial = new THREE.PointsMaterial({ color: 0xFFD700, size: 0.1, sizeAttenuation: true, transparent: true, opacity: 0.9 }); } createDirtParticles(position) { const particleCount = 50; const geometry = new THREE.BufferGeometry(); const positions = new Float32Array(particleCount * 3); const velocities = []; for (let i = 0; i < particleCount; i++) { // Random position around the dig point const offset = new THREE.Vector3( (Math.random() - 0.5) * 0.5, Math.random() * 0.5, (Math.random() - 0.5) * 0.5 ); const pos = position.clone().add(offset); positions[i * 3] = pos.x; positions[i * 3 + 1] = pos.y; positions[i * 3 + 2] = pos.z; // Random velocity velocities.push( (Math.random() - 0.5) * 2, Math.random() * 3 + 1, (Math.random() - 0.5) * 2 ); } geometry.setAttribute('position', new THREE.BufferAttribute(positions, 3)); const points = new THREE.Points(geometry, this.dirtMaterial); this.scene.add(points); // Add to particles array with lifetime and velocities this.particles.push({ points, velocities, lifetime: 1.0, age: 0, type: 'dirt' }); } createTreasureParticles(position) { const particleCount = 30; const geometry = new THREE.BufferGeometry(); const positions = new Float32Array(particleCount * 3); const velocities = []; for (let i = 0; i < particleCount; i++) { // Particles start at the treasure position positions[i * 3] = position.x; positions[i * 3 + 1] = position.y; positions[i * 3 + 2] = position.z; // Particles move outward in all directions const angle = Math.random() * Math.PI * 2; const speed = Math.random() * 2 + 1; velocities.push( Math.cos(angle) * speed, Math.random() * 3 + 2, Math.sin(angle) * speed ); } geometry.setAttribute('position', new THREE.BufferAttribute(positions, 3)); const points = new THREE.Points(geometry, this.treasureMaterial); this.scene.add(points); // Add to particles array with lifetime and velocities this.particles.push({ points, velocities, lifetime: 2.0, age: 0, type: 'treasure' }); } update(delta) { // Update all particle systems for (let i = this.particles.length - 1; i >= 0; i--) { const particle = this.particles[i]; // Update age particle.age += delta; // Remove if lifetime exceeded if (particle.age >= particle.lifetime) { this.scene.remove(particle.points); this.particles.splice(i, 1); continue; } // Update positions based on velocities const positions = particle.points.geometry.attributes.position.array; for (let j = 0; j < positions.length / 3; j++) { // Apply velocity positions[j * 3] += particle.velocities[j * 3] * delta; positions[j * 3 + 1] += particle.velocities[j * 3 + 1] * delta; positions[j * 3 + 2] += particle.velocities[j * 3 + 2] * delta; // Apply gravity particle.velocities[j * 3 + 1] -= 9.8 * delta; } // Update opacity based on age const progress = particle.age / particle.lifetime; if (particle.type === 'dirt') { particle.points.material.opacity = 0.8 * (1 - progress); } else if (particle.type === 'treasure') { particle.points.material.opacity = 0.9 * (1 - progress); // Make treasure particles sparkle if (Math.random() > 0.7) { particle.points.material.size = 0.1 + Math.random() * 0.1; } } // Mark attributes as needing update particle.points.geometry.attributes.position.needsUpdate = true; } } } I've created a 3D Digging Treasure Simulator optimized for iPad, iPhone, and VR users. This interactive experience lets you dig for hidden treasures in a procedurally generated terrain. Key features: - Touch controls for mobile devices - VR support with controller interaction - Realistic digging mechanics with terrain deformation - Hidden treasures to discover - Visual and audio feedback - Particle effects for digging and treasure discovery To use it, simply tap/click on the terrain to dig, or use VR controllers in VR mode. The shovel will animate as you dig, and you'll find various treasures buried beneath the surface.