// ThreeJS revision: 152 // IMPORTS: import * as THREE from 'three'; import { OrbitControls } from 'three/addons/controls/OrbitControls.js'; import { EffectComposer } from 'three/addons/postprocessing/EffectComposer.js'; import { RenderPass } from 'three/addons/postprocessing/RenderPass.js'; import { UnrealBloomPass } from 'three/addons/postprocessing/UnrealBloomPass.js'; import { SMAAPass } from 'three/addons/postprocessing/SMAAPass.js'; import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js'; /* This is where external user components are loaded into scope. This seems like the simplest solution to this problem as it does not require modifications to the Script loader. This requires an export statement at the end of the user script with the desires export components added. Components can be removed from this import statement to completely remove them without having to modify the external script contents - meaning it can hold objects that aren't even used in this script for later use. */ import { BasicSkyShader, MaterialManager, LightingManager, MeshManager } from 'https://play.rosebud.ai/assets/ThreeJSScripts.js?hZgy'; const APP_SETTINGS = { renderer: { shadowMap: { enabled: true, type: THREE.PCFSoftShadowMap }, colorSpace: { output: THREE.SRGBColorSpace, toneMapping: THREE.ACESFilmicToneMapping, toneMappingExposure: 1.2 }, antialias: true, pixelRatio: window.devicePixelRatio }, controls: { startEnemyWavesOnBoot: false, // Control variable for starting enemy waves createSingleEnemyOnBoot: false, // Control variable for creating a single enemy on boot enableEnemyAttackingState: true, // Control variable for enemy attacking state debugMapGenerator: true, // Control variable for debugging map generation generateTileMap: true, // Control variable for tile map generation createObstacle: false, // Control variable for creating obstacle enableEnemyPathfinding: false, // Control variable for enemy pathfinding createPlayerOnBoot: false, // Control variable for creating the player on boot createEnemyManagerOnBoot: false, // Control variable for creating the EnemyManager on boot }, TILEMAP_CONFIG: { width: 10, height: 10, tileSize: 2, baseHeight: -21, gridLineHeight: -20.90, gridLineColor: 0x000000 }, world: { defaults: { skyColor: 0x4A6D8C, // Darker blue color groundColor: 0xE6F3FF // Very light blue, almost white }, }, physics: { gravity: { x: 0, y: -9.81, z: 0 }, defaultContactMaterial: { friction: 0.01, restitution: 0.6 }, solver: { iterations: 10, tolerance: 0.001 }, collisionGroups: { default: 1, player: 2, obstacle: 4, enemy: 8, bullet: 16 } }, camera: { fov: 60, near: 0.1, far: 1000, initialPosition: { x: 0, y: 10, z: 5 } }, gameplay: {}, lights: { sunlight: { color: 0xffffff, intensity: 2, position: { x: 20, y: 100, z: 20 }, castShadow: true, shadow: { mapSize: { width: 2048, height: 2048 }, camera: { near: 10, far: 1000, left: -100, right: 100, top: 100, bottom: -100 }, bias: -0.0001 } } } }; const TEXTURE_ASSETS = { normal: { 'terrain_nrm': 'https://develop.play.rosebud.ai/assets/Grass_04_Nrm.png?BQVT', // Add more normal maps as needed }, texture: { 'terrain': 'https://develop.play.rosebud.ai/assets/Grass_04.png?MBRT', // Add more textures as needed }, sprites: { 'TomeSprites': 'https://play.rosebud.ai/assets/Tomes32x32.png?meX8', // Add more sprite sheets as needed } }; const SOUND_ASSETS = { sfx: { 'bullet_hit': { url: 'https://play.rosebud.ai/assets/snd_bullet_hit.wav?5GSg', volume: 1 }, 'shoot_gun': { url: 'https://play.rosebud.ai/assets/snd_gun_shoot.ogg?LwYY', volume: 0.5 }, 'enemy_attack': { url: 'https://play.rosebud.ai/assets/snd_woosh.mp3?zsBI', volume: 0.25 } }, music: { // Add background music assets here when available } }; // Components: function TextureManager() { class TextureManager { constructor() { this.textures = new Map(); this.loader = new THREE.TextureLoader(LoadingManager); this.texturesLoaded = false; this.loadTextures(); } load(key, url, onLoad = () => {}, onProgress = () => {}, onError = () => {}) { if (this.textures.has(key)) { onLoad(this.textures.get(key)); return Promise.resolve(this.textures.get(key)); } return new Promise((resolve, reject) => { this.loader.load( url, (texture) => { this.textures.set(key, texture); onLoad(texture); resolve(texture); }, onProgress, (error) => { onError(error); reject(error); } ); }); } loadTextures() { return new Promise((resolve, reject) => { const texturePromises = []; // Iterate through each category in TEXTURE_ASSETS for (const category in TEXTURE_ASSETS) { for (const textureName in TEXTURE_ASSETS[category]) { const textureUrl = TEXTURE_ASSETS[category][textureName]; const key = textureName; texturePromises.push( this.load( key, textureUrl, (texture) => { if (category === 'sprites') { texture.minFilter = THREE.NearestFilter; texture.magFilter = THREE.NearestFilter; texture.generateMipmaps = false; } console.log(`Loaded ${category} texture: ${key}`); } ) ); } } Promise.all(texturePromises) .then((loadedTextures) => { this.texturesLoaded = true; console.log('All textures loaded successfully'); console.log('Loaded textures:'); this.textures.forEach((texture, key) => { console.log(`- ${key}: ${texture.image.src}`); }); resolve(); }) .catch((error) => { console.error('Error loading textures:', error); reject(error); }); }); } getTexture(key) { const texture = this.textures.get(key); if (!texture) { console.warn(`Texture with key "${key}" not found.`); } return texture; } dispose(key) { if (this.textures.has(key)) { this.textures.get(key).dispose(); this.textures.delete(key); } } disposeAll() { for (let texture of this.textures.values()) { texture.dispose(); } this.textures.clear(); } } return new TextureManager(); } class Renderer { constructor() { this.postProcessing = null; this.renderer = new THREE.WebGLRenderer({ antialias: APP_SETTINGS.renderer.antialias, canvas: canvas, powerPreference: "high-performance" }); this.init(); } init() { this.renderer.setPixelRatio(APP_SETTINGS.renderer.pixelRatio); this.renderer.setSize(canvas.offsetWidth, canvas.offsetHeight); this.renderer.shadowMap.enabled = APP_SETTINGS.renderer.shadowMap.enabled; this.renderer.shadowMap.type = APP_SETTINGS.renderer.shadowMap.type; this.renderer.outputColorSpace = APP_SETTINGS.renderer.colorSpace.output; this.renderer.toneMapping = APP_SETTINGS.renderer.colorSpace.toneMapping; this.renderer.toneMappingExposure = APP_SETTINGS.renderer.colorSpace.toneMappingExposure; console.log('Renderer initialized with APP_SETTINGS parameters'); } initPostProcessing() { this.postProcessing = new PostProcessing(this.renderer, WorldScene, MainCamera); window.PostProcessing = this.postProcessing; } render() { if (this.postProcessing) { this.postProcessing.render(); } else { this.renderer.render(WorldScene, MainCamera); } } setSize(width, height) { this.renderer.setSize(width, height); if (this.postProcessing) { this.postProcessing.setSize(width, height); } } } class PostProcessing { constructor() { this.composer = null; this.bloomPass = null; this.smaaPass = null; this.initComposer(); } initComposer() { this.composer = new EffectComposer(GameRenderer.renderer); const renderPass = new RenderPass(WorldScene, MainCamera); this.composer.addPass(renderPass); this.bloomPass = new UnrealBloomPass( new THREE.Vector2(innerWidth, innerHeight), 0.2, // bloom strength 0.4, // radius 0.9 // threshold ); this.composer.addPass(this.bloomPass); this.smaaPass = new SMAAPass( innerWidth * GameRenderer.renderer.getPixelRatio(), innerHeight * GameRenderer.renderer.getPixelRatio() ); this.composer.addPass(this.smaaPass); } setSize(width, height) { this.composer.setSize(width, height); this.bloomPass.resolution.set(width, height); this.smaaPass.setSize(width, height); } render() { this.composer.render(); } } class SkyBox { constructor() { this.skyMesh = null; this.shaderMaterial = null; this.loadSkyboxModel(); } loadSkyboxModel() { const loader = new GLTFLoader(LoadingManager); loader.load('https://play.rosebud.ai/assets/SkyboxSphere.glb?BkJ1', (gltf) => { this.skyMesh = gltf.scene.children[0]; this.skyMesh.scale.set(1500, 1200, 1500); // Create and apply the new shader material const skyColor = new THREE.Color(APP_SETTINGS.world.defaults.skyColor); const groundColor = new THREE.Color(APP_SETTINGS.world.defaults.groundColor); this.shaderMaterial = BasicSkyShader(skyColor, groundColor); this.skyMesh.material = this.shaderMaterial.material; WorldScene.add(this.skyMesh); console.log('Skybox created with default colors:', skyColor, groundColor); this.updateSunPosition(); }); } update(deltaTime) { this.updateSunPosition(); } updateSunPosition() { if (this.shaderMaterial && Lights.getLight('sunLight')) { const sunLight = Lights.getLight('sunLight'); const sunDirection = new THREE.Vector3(); sunLight.getWorldDirection(sunDirection); this.shaderMaterial.setSunPosition(sunDirection); } } getSkyColor() { return this.shaderMaterial ? this.shaderMaterial.skyColor : new THREE.Color(0x87CEEB); } getGroundColor() { return this.shaderMaterial ? this.shaderMaterial.groundColor : new THREE.Color(0xFFFFFF); } setSkyColor(color) { if (this.shaderMaterial) { this.shaderMaterial.setSkyColor(color); } } setGroundColor(color) { if (this.shaderMaterial) { this.shaderMaterial.setGroundColor(color); } } } class WorldTime { constructor() { this.currentTime = 0; // Time in seconds this.timeScale = 1; // 1 second real time = 1 second game time this.tweening = false; this.tweenStartTime = 0; this.tweenEndTime = 0; this.tweenDuration = 0; } update(deltaTime) { if (this.tweening) { this.updateTween(deltaTime); } else { this.currentTime += deltaTime * this.timeScale; } } setTimeScale(scale) { this.timeScale = scale; } getHours() { return Math.floor(this.currentTime / 3600) % 24; } getMinutes() { return Math.floor((this.currentTime % 3600) / 60); } getSeconds() { return Math.floor(this.currentTime % 60); } getTimeString() { const hours = this.getHours().toString().padStart(2, '0'); const minutes = this.getMinutes().toString().padStart(2, '0'); const seconds = this.getSeconds().toString().padStart(2, '0'); return `${hours}:${minutes}:${seconds}`; } setTime(hours) { const targetTime = hours * 3600; // Convert hours to seconds this.tweenStartTime = this.currentTime; this.tweenEndTime = targetTime; this.tweenDuration = 2; // Duration of the tween in seconds this.tweening = true; } updateTween(deltaTime) { const elapsedTime = Math.min(deltaTime, this.tweenDuration); const progress = elapsedTime / this.tweenDuration; this.currentTime = this.tweenStartTime + (this.tweenEndTime - this.tweenStartTime) * progress; this.tweenDuration -= elapsedTime; if (this.tweenDuration <= 0) { this.currentTime = this.tweenEndTime; this.tweening = false; } } } class World { constructor() { window.WorldScene = new THREE.Scene(); this.skybox = new SkyBox(WorldScene); this.lights = {}; this.physicsWorld = new CANNON.World(); this.setupPhysicsWorld(); this.initCamera(); this.initRenderer(); this.initLights(); this.Time = new WorldTime(); this.player = null; this.navMesh = null; this.obstacle = null; if (APP_SETTINGS.controls.createObstacle) { this.createObstacle(); } this.astar = null; this.testPath = null; this.tileMap = null; } createTileMap() { const mapGenerator = new TileMapGenerator(); // Adjust size as needed this.tileMap = mapGenerator.generateMap(); WorldScene.add(this.tileMap.render()); if (APP_SETTINGS.controls.debugMapGenerator) { const gridLines = mapGenerator.createGridLines(this.tileMap); WorldScene.add(gridLines); } console.log('TileMap created and added to the scene'); } // Remove this method as BulletManager is now initialized globally setupPhysicsWorld() { this.physicsWorld.gravity.set( APP_SETTINGS.physics.gravity.x, APP_SETTINGS.physics.gravity.y, APP_SETTINGS.physics.gravity.z ); this.physicsWorld.defaultContactMaterial.friction = APP_SETTINGS.physics.defaultContactMaterial.friction; this.physicsWorld.defaultContactMaterial.restitution = APP_SETTINGS.physics.defaultContactMaterial.restitution; this.physicsWorld.solver.iterations = APP_SETTINGS.physics.solver.iterations; this.physicsWorld.solver.tolerance = APP_SETTINGS.physics.solver.tolerance; this.groundPhysMaterial = new CANNON.Material('ground'); } initLights() { const defaultSkyColor = new THREE.Color(APP_SETTINGS.world.defaults.skyColor); const defaultGroundColor = new THREE.Color(APP_SETTINGS.world.defaults.groundColor); const sunlightSettings = APP_SETTINGS.lights.sunlight; Lights.createLight('sunLight', 'directional', { color: sunlightSettings.color, intensity: sunlightSettings.intensity, position: sunlightSettings.position, castShadow: sunlightSettings.castShadow, shadow: sunlightSettings.shadow }); Lights.createLight('hemiLight', 'hemisphere', { skyColor: defaultSkyColor, groundColor: defaultGroundColor, intensity: 0.6 }); console.log('Lights initialized with default colors:', defaultSkyColor, defaultGroundColor); } getLight(name) { return Lights.getLight(name); } calculateSunRotation(time) { const rotationSpeed = 0.1; // Adjust this value to change the orbit speed const angle = time * rotationSpeed; const radius = 100; // Adjust this value to change the orbit radius const x = Math.cos(angle) * radius; const z = Math.sin(angle) * radius; const baseHeight = 80; // Increased from 50 to 80 const verticalAmplitude = 30; // Increased from 20 to 30 const y = baseHeight + Math.sin(angle * 0.5) * verticalAmplitude; return new THREE.Vector3(x, y, z); } updateSunlight(playerPosition) { Lights.updateLight('sunLight', (sunLight) => { const offset = this.calculateSunRotation(this.Time.currentTime); sunLight.position.copy(playerPosition).add(offset); // Update the target if (!sunLight.target) { sunLight.target = new THREE.Object3D(); WorldScene.add(sunLight.target); } sunLight.target.position.copy(playerPosition); }); // Update the skybox sun position if (this.skybox) { this.skybox.updateSunPosition(); } } initCamera() { window.MainCamera = new THREE.PerspectiveCamera( APP_SETTINGS.camera.fov, canvas.offsetWidth / canvas.offsetHeight, APP_SETTINGS.camera.near, APP_SETTINGS.camera.far ); // Set the new position based on APP_SETTINGS MainCamera.position.set( APP_SETTINGS.camera.initialPosition.x, APP_SETTINGS.camera.initialPosition.y, APP_SETTINGS.camera.initialPosition.z ); MainCamera.lookAt(0, -20, 0); // Look at the center of the terrain console.log('Camera initialized with top-down view'); } initRenderer() { window.GameRenderer = new Renderer(MainCamera); GameRenderer.initPostProcessing(WorldScene); } createObstacle() { const obstaclePosition = new THREE.Vector3(3, -18, 3); const obstacleSize = new THREE.Vector3(4, 2, 2); // Doubled the x component (length) this.obstacle = new Obstacle(this, obstaclePosition, obstacleSize); } update(deltaTime) { this.Time.update(deltaTime); this.physicsWorld.step(deltaTime); // Update sunlight position based on a fixed point (e.g., world origin) this.updateSunlight(new THREE.Vector3(0, 0, 0)); this.skybox.update(deltaTime); // Ensure NavMesh visualization stays visible if (this.navMesh) { this.navMesh.getVisualization().visible = true; } if (window.Player) { window.Player.update(deltaTime); } // Update enemies window.EnemyManager.updateEnemies(deltaTime); this.deltaTime = deltaTime; // Store deltaTime for use in other methods // Update bullets using global BulletManager window.BulletManager.update(deltaTime); if (window.Player && window.Player.gun) { window.Player.gun.update(deltaTime); } if (this.obstacle) { this.obstacle.update(); } // Process enemy removal queue at the end of the update loop window.EnemyManager.processRemovalQueue(); GameRenderer.render(); } } class NavMesh { constructor(terrain, gridSize = 1) { this.terrain = terrain; this.gridSize = gridSize; this.grid = []; this.visualization = new THREE.Group(); this.skippedPoints = []; this.generateGrid(); this.createVisualization(); } isPointOverlappingObstacle(point) { if (GameWorld.obstacle) { const obstaclePosition = GameWorld.obstacle.mesh.position; const obstacleSize = GameWorld.obstacle.mesh.geometry.parameters; return ( point.x >= obstaclePosition.x - obstacleSize.width / 2 && point.x <= obstaclePosition.x + obstacleSize.width / 2 && point.z >= obstaclePosition.z - obstacleSize.depth / 2 && point.z <= obstaclePosition.z + obstacleSize.depth / 2 ); } return false; } generateGrid() { const terrainGeometry = this.terrain.geometry; const terrainSize = { width: terrainGeometry.parameters.width, height: terrainGeometry.parameters.height }; for (let x = -terrainSize.width / 2; x <= terrainSize.width / 2; x += this.gridSize) { for (let z = -terrainSize.height / 2; z <= terrainSize.height / 2; z += this.gridSize) { const y = this.terrain.position.y + 0.1; // Slightly above the terrain const point = new THREE.Vector3(x, y, z); if (!this.isPointOverlappingObstacle(point)) { this.grid.push(point); } else { this.skippedPoints.push(point); } } } console.log(`NavMesh: Generated ${this.grid.length} walkable points`); console.log(`NavMesh: Skipped ${this.skippedPoints.length} points due to obstacle overlap`); // Adjust visualization for increased density this.adjustVisualizationForDensity(); } adjustVisualizationForDensity() { // Reduce the size of visualization spheres const walkableSphereGeometry = new THREE.SphereGeometry(0.1); // Reduced from 0.2 const skippedSphereGeometry = new THREE.SphereGeometry(0.05); // Reduced from 0.1 // Update existing visualization this.visualization.children.forEach(child => { if (child instanceof THREE.Mesh) { if (child.geometry.type === 'SphereGeometry') { child.geometry = child.geometry.parameters.radius === 0.2 ? walkableSphereGeometry : skippedSphereGeometry; } } }); } createVisualization() { const walkableSphereGeometry = new THREE.SphereGeometry(0.2); const walkableSphereMaterial = new THREE.MeshBasicMaterial({ color: 0xff0000 }); const skippedSphereGeometry = new THREE.SphereGeometry(0.1); const skippedSphereMaterial = new THREE.MeshBasicMaterial({ color: 0x0000ff }); this.grid.forEach(point => { const sphere = new THREE.Mesh(walkableSphereGeometry, walkableSphereMaterial); sphere.position.copy(point); this.visualization.add(sphere); }); this.skippedPoints.forEach(point => { const sphere = new THREE.Mesh(skippedSphereGeometry, skippedSphereMaterial); sphere.position.copy(point); this.visualization.add(sphere); }); const lineMaterial = new THREE.LineBasicMaterial({ color: 0x00ff00 }); for (let i = 0; i < this.grid.length; i++) { const point = this.grid[i]; const nextHorizontal = this.grid[i + 1]; const nextVertical = this.grid[i + Math.sqrt(this.grid.length)]; if (nextHorizontal && Math.abs(nextHorizontal.x - point.x) <= this.gridSize) { const lineGeometry = new THREE.BufferGeometry().setFromPoints([point, nextHorizontal]); const line = new THREE.Line(lineGeometry, lineMaterial); this.visualization.add(line); } if (nextVertical) { const lineGeometry = new THREE.BufferGeometry().setFromPoints([point, nextVertical]); const line = new THREE.Line(lineGeometry, lineMaterial); this.visualization.add(line); } } // Note: We're not adding this.visualization to WorldScene anymore } getVisualization() { return this.visualization; } } class Bullet { constructor(position, direction, bulletManager) { this.bulletManager = bulletManager; this.mesh = this.createMesh(position); this.body = this.createBody(position); this.initialDirection = direction.clone().normalize(); this.speed = 20; // Units per second this.lifetime = 2; // Seconds this.id = Math.random().toString(36).substr(2, 9); // Generate a unique ID this.debugInterval = 1; // Log debug info every 1 second this.timeSinceLastDebug = 0; this.damage = 50; // Add damage property this.hasDamaged = false; // Add flag to track if bullet has dealt damage } createMesh(position) { const radius = 0.10; const height = 0.3; const geometry = new THREE.CylinderGeometry(radius, radius, height, 8); const material = new THREE.MeshBasicMaterial({ color: 0x000000 // Black color }); const mesh = new THREE.Mesh(geometry, material); mesh.rotation.x = Math.PI / 2; mesh.position.copy(position); WorldScene.add(mesh); return mesh; } createBody(position) { // Increased size significantly for testing const shape = new CANNON.Cylinder(0.5, 0.5, 1.5, 8); const body = new CANNON.Body({ mass: 0, shape: shape, position: new CANNON.Vec3(position.x, position.y, position.z), collisionFilterGroup: APP_SETTINGS.physics.collisionGroups.bullet, collisionFilterMask: APP_SETTINGS.physics.collisionGroups.enemy | APP_SETTINGS.physics.collisionGroups.obstacle }); body.addEventListener("collide", this.onCollide.bind(this)); GameWorld.physicsWorld.addBody(body); return body; } onCollide(event) { const otherBody = event.body; if (otherBody.collisionFilterGroup === APP_SETTINGS.physics.collisionGroups.enemy && !this.hasDamaged) { // Play bullet hit sound if (window.AudioManager) { window.AudioManager.playSound('bullet_hit'); } // Apply damage to the enemy if (otherBody.enemy && typeof otherBody.enemy.takeDamage === 'function') { otherBody.enemy.takeDamage(this.damage); this.hasDamaged = true; // Set the flag to true after dealing damage } } // Queue the bullet for removal this.bulletManager.queueForRemoval(this); } update(deltaTime) { const movement = this.initialDirection.clone().multiplyScalar(this.speed * deltaTime); this.body.position.vadd(new CANNON.Vec3(movement.x, movement.y, movement.z), this.body.position); this.body.quaternion.setFromVectors(new CANNON.Vec3(0, 1, 0), new CANNON.Vec3(this.initialDirection.x, this.initialDirection.y, this.initialDirection.z)); this.mesh.position.copy(this.body.position); this.mesh.quaternion.copy(this.body.quaternion); this.lifetime -= deltaTime; } remove() { WorldScene.remove(this.mesh); GameWorld.physicsWorld.removeBody(this.body); } } class BulletManager { constructor() { this.bullets = []; this.removalQueue = []; } createBullet(position, direction) { const bullet = new Bullet(position, direction, this); this.bullets.push(bullet); return bullet; } update(deltaTime) { this.bullets.forEach(bullet => { bullet.update(deltaTime); if (bullet.lifetime <= 0) { this.queueForRemoval(bullet); } }); this.processRemovalQueue(); } queueForRemoval(bullet) { this.removalQueue.push(bullet); } processRemovalQueue() { while (this.removalQueue.length > 0) { const bullet = this.removalQueue.pop(); const index = this.bullets.indexOf(bullet); if (index !== -1) { this.bullets.splice(index, 1); bullet.remove(); } } } } class Gun { constructor() { this.mesh = new THREE.Group(); this.createGun(); this.bulletManager = new BulletManager(); this.lastFireTime = 0; this.fireRate = 0.25; // 4 bullets per second this.isFiring = false; } createGun() { // Create gun barrel const barrelGeometry = new THREE.BoxGeometry(0.1, 0.1, 0.5); const barrelMaterial = new THREE.MeshPhongMaterial({ color: 0x333333 }); const barrel = new THREE.Mesh(barrelGeometry, barrelMaterial); barrel.position.set(0, 0, 0.25); // Create gun body const bodyGeometry = new THREE.BoxGeometry(0.3, 0.3, 0.4); const bodyMaterial = new THREE.MeshPhongMaterial({ color: 0x666666 }); const body = new THREE.Mesh(bodyGeometry, bodyMaterial); body.position.set(0, -0.1, 0); // Create gun handle const handleGeometry = new THREE.BoxGeometry(0.15, 0.4, 0.1); const handleMaterial = new THREE.MeshPhongMaterial({ color: 0x8B4513 }); const handle = new THREE.Mesh(handleGeometry, handleMaterial); handle.position.set(0, -0.35, -0.15); // Add all parts to the gun mesh this.mesh.add(barrel); this.mesh.add(body); this.mesh.add(handle); // Rotate the gun to face forward this.mesh.rotation.y = Math.PI / 2; } setPosition(x, y, z) { this.mesh.position.set(x, y, z); } fire(playerPosition, playerDirection) { this.isFiring = true; } update(deltaTime) { const now = performance.now() / 1000; // Convert to seconds if (this.isFiring && now - this.lastFireTime >= this.fireRate) { const bulletPosition = new THREE.Vector3().copy(this.mesh.getWorldPosition(new THREE.Vector3())); bulletPosition.add(this.mesh.getWorldDirection(new THREE.Vector3()).multiplyScalar(1)); const bulletDirection = this.mesh.getWorldDirection(new THREE.Vector3()); this.bulletManager.createBullet(bulletPosition, bulletDirection); // Play gun shoot sound if (window.AudioManager) { window.AudioManager.playSound('shoot_gun'); } this.lastFireTime = now; } this.isFiring = false; // Reset firing state // Update bullets this.bulletManager.update(deltaTime); } } class Player { constructor(world) { this.world = world; this.mesh = null; this.body = null; this.moveSpeed = 8; this.moveDirection = new CANNON.Vec3(0, 0, 0); this.facingDirection = new THREE.Vector3(1, 0, 0); this.createMesh(); this.createBody(); this.createGun(); } createGun() { this.gun = new Gun(); this.mesh.add(this.gun.mesh); // Attach the gun to the player's mesh // Initial position and rotation will be set in updateGunPosition this.updateGunPosition(); } getPosition() { return this.body.position.clone(); } updateGunPosition() { const gunDistance = 1; // Distance from player center const gunHeight = 0.5; // Height above player center // Set gun position this.gun.mesh.position.set( this.facingDirection.x * gunDistance, gunHeight, this.facingDirection.z * gunDistance ); // Set gun rotation this.gun.mesh.rotation.y = Math.atan2(this.facingDirection.x, this.facingDirection.z); } createMesh() { const geometry = new THREE.CapsuleGeometry(0.5, 1, 4, 8); const material = Materials.create('playerMaterial', 'standard', { color: 0xFF6B8A, // Pinkish red color roughness: 0.7, metalness: 0.3 }); this.mesh = new THREE.Mesh(geometry, material); this.mesh.castShadow = true; this.mesh.position.set(0, -18.5, 0); // Position the player 1.5 units above the terrain WorldScene.add(this.mesh); console.log('Player mesh created. Position:', this.mesh.position.toArray()); } createBody() { const shape = new CANNON.Cylinder(0.5, 0.5, 2, 8); const playerMaterial = new CANNON.Material('player'); this.body = new CANNON.Body({ mass: 80, // Increase mass for more stability shape: shape, material: playerMaterial, linearDamping: 0.95, // Increase linear damping for smoother movement angularDamping: 0.99, // Increase angular damping to reduce rotation collisionFilterGroup: APP_SETTINGS.physics.collisionGroups.player, collisionFilterMask: APP_SETTINGS.physics.collisionGroups.default | APP_SETTINGS.physics.collisionGroups.obstacle | APP_SETTINGS.physics.collisionGroups.enemy }); this.body.position.set(0, -17.5, 0); // Position the physics body 2.5 units above the terrain (1 unit higher) this.body.fixedRotation = true; // Lock rotation to keep the player upright this.body.updateMassProperties(); // Update mass properties after changing rotation constraints this.world.physicsWorld.addBody(this.body); // Create contact material between player and ground const playerGroundContact = new CANNON.ContactMaterial( playerMaterial, this.world.groundPhysMaterial, { friction: 0.5, restitution: 0 // Zero restitution to remove bounciness } ); this.world.physicsWorld.addContactMaterial(playerGroundContact); console.log('Player body created. Position:', this.body.position.toArray()); } update(deltaTime) { // Ensure deltaTime is a valid number deltaTime = isNaN(deltaTime) ? 0 : Math.max(0, Math.min(deltaTime, 0.1)); // Calculate movement direction based on key states this.moveDirection.set( (Input.keys.d ? 1 : 0) - (Input.keys.a ? 1 : 0), 0, (Input.keys.s ? 1 : 0) - (Input.keys.w ? 1 : 0) ); // Normalize the movement direction if it's not zero if (this.moveDirection.lengthSquared() > 0) { this.moveDirection.normalize(); } // Calculate movement const movement = this.moveDirection.scale(this.moveSpeed * deltaTime); // Use default values if movement becomes NaN if (isNaN(movement.x) || isNaN(movement.y) || isNaN(movement.z)) { movement.set(0, 0, 0); } // Apply movement to the physics body const newPosition = this.body.position.vadd(movement); this.body.position.copy(newPosition); // Update mesh position to match physics body, with an offset this.mesh.position.copy(this.body.position).sub(new THREE.Vector3(0, -.5, 0)); this.mesh.quaternion.copy(this.body.quaternion); // Update the gun position and rotation this.updateGunPosition(); // Fire only when mouse is down if (Input.mouseDown) { this.gun.fire(this.mesh.position, this.facingDirection); } this.gun.update(deltaTime); } createDebugLine() { const geometry = new THREE.BufferGeometry().setFromPoints([ new THREE.Vector3(0, 0, 0), new THREE.Vector3(0, 0, 5) ]); const material = new THREE.LineBasicMaterial({ color: 0xff0000 }); this.debugLine = new THREE.Line(geometry, material); this.debugLine.position.copy(this.mesh.position); WorldScene.add(this.debugLine); } updateFacingDirection(cursorPosition) { this.facingDirection.copy(cursorPosition).sub(this.mesh.position).normalize(); this.facingDirection.y = 0; // Keep the facing direction in the XZ plane const angle = Math.atan2(this.facingDirection.x, this.facingDirection.z); this.mesh.rotation.y = angle; // Update the gun position and rotation this.updateGunPosition(); } updateDebugLine() { // Update the start point of the line to match the player's position this.debugLine.position.copy(this.mesh.position); // Calculate the end point of the line using the facing direction const endPoint = new THREE.Vector3() .copy(this.facingDirection) .multiplyScalar(5) // Length of the debug line .add(this.mesh.position); // Update the geometry of the debug line this.debugLine.geometry.setFromPoints([ new THREE.Vector3(0, 0, 0), // Start point (relative to the line's position) endPoint.sub(this.mesh.position) // End point (relative to the line's position) ]); // Update the line's geometry this.debugLine.geometry.verticesNeedUpdate = true; } } class Enemy { constructor(world, position) { this.world = world; this.mesh = null; this.body = null; this.createMesh(position); this.createBody(position); this.pathUpdateInterval = 0.5; // Update path every 0.5 seconds this.lastPathUpdateTime = 0; this.currentPath = null; this.moveSpeed = 7.5; // Units per second this.currentPathIndex = 0; this.maxHealth = 100; this.health = this.maxHealth; this.isDead = false; // State management this.states = { CHASING: 'CHASING', ATTACKING: 'ATTACKING' }; this.currentState = this.states.CHASING; this.attackRange = 2; // Distance at which enemy starts attacking this.attackDuration = 0.5; // Duration of attack in seconds (reduced by 50%) this.attackCooldown = 2; // Cooldown between attacks in seconds this.lastAttackTime = 0; this.attackTimer = 0; this.lungeSpeed = 10; // Speed of the lunge attack this.isLunging = false; this.lungeDuration = 0.25; // Half of the attack duration for moving towards the player this.lungeDirection = new CANNON.Vec3(); } setPosition(position) { if (this.body) { this.body.position.copy(position); } if (this.mesh) { this.mesh.position.copy(position).add(new THREE.Vector3(0, 1, 0)); } console.log(`Enemy position set to: (${position.x.toFixed(2)}, ${position.y.toFixed(2)}, ${position.z.toFixed(2)})`); } createMesh(position) { const geometry = new THREE.CapsuleGeometry(0.5, 1, 4, 8); const material = Materials.create('enemyMaterial', 'standard', { color: 0x00FF00, // Green color roughness: 0.7, metalness: 0.3 }); this.mesh = new THREE.Mesh(geometry, material); this.mesh.castShadow = true; this.setPosition(position); WorldScene.add(this.mesh); } setColor(color) { if (this.mesh && this.mesh.material) { this.mesh.material.color.setHex(color); } } createBody(position) { const shape = new CANNON.Cylinder(0.5, 0.5, 2, 8); const enemyMaterial = new CANNON.Material('enemy'); this.body = new CANNON.Body({ mass: 80, shape: shape, material: enemyMaterial, fixedRotation: true, collisionFilterGroup: APP_SETTINGS.physics.collisionGroups.enemy, collisionFilterMask: APP_SETTINGS.physics.collisionGroups.default | APP_SETTINGS.physics.collisionGroups.obstacle | APP_SETTINGS.physics.collisionGroups.bullet, linearDamping: 0.1, angularDamping: 0.1 }); this.body.enemy = this; // Add a reference to the Enemy instance this.setPosition(position); console.log("Enemy body created with collision group:", this.body.collisionFilterGroup); console.log("Enemy collision mask:", this.body.collisionFilterMask); // Create contact material between enemy and ground const enemyGroundContact = new CANNON.ContactMaterial( enemyMaterial, this.world.groundPhysMaterial, { friction: 0.001, restitution: 0, contactEquationStiffness: 1e8, contactEquationRelaxation: 3 } ); this.world.physicsWorld.addContactMaterial(enemyGroundContact); // Set the collision response to the body this.body.collisionResponse = 1; // Ensure collision response is enabled this.world.physicsWorld.addBody(this.body); } update(deltaTime) { if (this.isDead) return; // Only update mesh position if not lunging if (!this.isLunging) { this.setPosition(this.body.position); this.mesh.quaternion.copy(this.body.quaternion); } // State transition logic if (APP_SETTINGS.controls.enableEnemyAttackingState) { const distanceToPlayer = this.distanceToPlayer(); switch (this.currentState) { case this.states.CHASING: if (distanceToPlayer <= this.attackRange && !this.isLunging) { this.transitionToState(this.states.ATTACKING); } break; case this.states.ATTACKING: // The transition back to CHASING is now handled in the attackPlayer method break; } } // Execute current state action this.executeStateAction(deltaTime); // Logging this.lastLogTime += deltaTime; if (this.lastLogTime >= this.logInterval) { this.lastLogTime = 0; } } executeStateAction(deltaTime) { switch (this.currentState) { case this.states.CHASING: this.chasePlayer(deltaTime); break; case this.states.ATTACKING: this.attackPlayer(deltaTime); break; } } chasePlayer(deltaTime) { if (APP_SETTINGS.controls.enableEnemyPathfinding) { this.lastPathUpdateTime += deltaTime; if (this.lastPathUpdateTime >= this.pathUpdateInterval) { this.calculatePathToPlayer(); this.lastPathUpdateTime = 0; this.currentPathIndex = 0; } this.moveAlongPath(deltaTime); } else { // Simple direct movement towards the player if (window.Player) { const direction = new CANNON.Vec3() .copy(window.Player.getPosition()) .vsub(this.body.position) .unit(); const desiredVelocity = direction.scale(this.moveSpeed); this.body.velocity.set(desiredVelocity.x, this.body.velocity.y, desiredVelocity.z); } } } distanceToPlayer() { if (window.Player) { return this.mesh.position.distanceTo(window.Player.mesh.position); } return Infinity; } transitionToState(newState) { this.onExitState(this.currentState); this.currentState = newState; this.onEnterState(newState); } attackPlayer(deltaTime) { if (!this.isLunging) { // Start the lunge this.isLunging = true; this.attackTimer = 0; this.originalPosition = this.body.position.clone(); this.targetPosition = window.Player ? window.Player.getPosition() : this.originalPosition.clone(); this.targetPosition.y = this.originalPosition.y; // Keep the same height this.body.velocity.setZero(); // Stop ongoing movement // Play enemy attack sound if (window.AudioManager) { window.AudioManager.playSound('enemy_attack'); } } this.attackTimer += deltaTime; const attackProgress = this.attackTimer / this.attackDuration; let newPosition; if (attackProgress <= 0.5) { // First half: move towards the player newPosition = this.lerpPosition(this.originalPosition, this.targetPosition, attackProgress * 2); } else { // Second half: move back to the original position newPosition = this.lerpPosition(this.targetPosition, this.originalPosition, (attackProgress - 0.5) * 2); } // Use setPosition to update the enemy's position this.setPosition(newPosition); if (this.attackTimer >= this.attackDuration) { // Attack finished this.setPosition(this.originalPosition); this.body.velocity.setZero(); this.isLunging = false; this.transitionToState(this.states.CHASING); } } lerpPosition(start, end, t) { return new CANNON.Vec3( start.x + (end.x - start.x) * t, start.y + (end.y - start.y) * t, start.z + (end.z - start.z) * t ); } onEnterState(newState) { console.log(`Enemy entering state: ${newState}`); switch (newState) { case this.states.ATTACKING: this.attackTimer = 0; this.setColor(0xFF69B4); // Pink color for attacking state this.body.velocity.setZero(); // Stop ongoing movement break; case this.states.CHASING: // Reset any chasing-specific variables if needed break; } } onExitState(oldState) { console.log(`Enemy exiting state: ${oldState}`); switch (oldState) { case this.states.ATTACKING: // Reset attack-related variables if needed this.setColor(0x00FF00); // Green color when exiting attacking state this.isLunging = false; break; case this.states.CHASING: // Clean up any chasing-specific variables if needed break; } } takeDamage(amount) { this.health -= amount; if (this.health <= 0) { this.die(); } } die() { if (!this.isDead) { this.isDead = true; console.log("Enemy has died!"); // Queue the enemy for removal instead of immediate removal window.EnemyManager.queueEnemyForRemoval(this); // You might want to add more cleanup or death effects here } } calculatePathToPlayer() { if (!window.Player || !this.world.navMesh || !this.world.astar) { return; } const startNode = this.world.astar.findNearestNode(this.mesh.position); const goalNode = this.world.astar.findNearestNode(window.Player.mesh.position); if (!startNode || !goalNode) { return; } this.currentPath = this.world.astar.findPath(startNode, goalNode); } moveAlongPath(deltaTime) { if (!this.currentPath || this.currentPathIndex >= this.currentPath.length) { return; } const targetPosition = this.currentPath[this.currentPathIndex]; const direction = new CANNON.Vec3() .copy(targetPosition) .vsub(this.body.position) .unit(); const desiredVelocity = direction.scale(this.moveSpeed); this.body.velocity.set(desiredVelocity.x, this.body.velocity.y, desiredVelocity.z); if (this.body.position.distanceTo(new CANNON.Vec3(targetPosition.x, this.body.position.y, targetPosition.z)) < 0.5) { this.currentPathIndex++; if (this.currentPathIndex >= this.currentPath.length) { this.body.velocity.setZero(); this.calculatePathToPlayer(); // Recalculate path when reaching the end } } } } class EnemyManager { constructor(world) { this.world = world; this.enemies = []; this.removalQueue = []; } createEnemy(position) { const enemy = new Enemy(this.world, position, this); this.enemies.push(enemy); return enemy; } updateEnemies(deltaTime) { this.enemies.forEach(enemy => enemy.update(deltaTime)); } queueEnemyForRemoval(enemy) { this.removalQueue.push(enemy); } processRemovalQueue() { this.removalQueue.forEach(enemy => { const index = this.enemies.indexOf(enemy); if (index !== -1) { this.enemies.splice(index, 1); WorldScene.remove(enemy.mesh); this.world.physicsWorld.remove(enemy.body); window.EnemySpawner.notifyEnemyDeath(); } }); this.removalQueue = []; } } class Obstacle { constructor(world, position, size) { this.world = world; this.mesh = null; this.body = null; this.createMesh(position, size); this.createBody(position, size); } createMesh(position, size) { const geometry = new THREE.BoxGeometry(size.x, size.y, size.z); const material = Materials.create('obstacleMaterial', 'standard', { color: 0x808080, // Grey color roughness: 0.7, metalness: 0.3 }); this.mesh = new THREE.Mesh(geometry, material); this.mesh.castShadow = true; this.mesh.receiveShadow = true; this.mesh.position.copy(position); WorldScene.add(this.mesh); console.log('Obstacle mesh created. Position:', this.mesh.position.toArray()); } createBody(position, size) { const shape = new CANNON.Box(new CANNON.Vec3(size.x / 2, size.y / 2, size.z / 2)); const obstacleMaterial = new CANNON.Material('obstacle'); this.body = new CANNON.Body({ mass: 0, // Static body shape: shape, material: obstacleMaterial, position: position, collisionFilterGroup: APP_SETTINGS.physics.collisionGroups.obstacle, collisionFilterMask: APP_SETTINGS.physics.collisionGroups.default | APP_SETTINGS.physics.collisionGroups.player | APP_SETTINGS.physics.collisionGroups.enemy | APP_SETTINGS.physics.collisionGroups.obstacle }); this.world.physicsWorld.addBody(this.body); console.log('Obstacle body created. Position:', this.body.position.toArray()); } update() { // Update mesh position to match physics body this.mesh.position.copy(this.body.position); this.mesh.quaternion.copy(this.body.quaternion); } } class AStar { constructor(navMesh) { this.navMesh = navMesh; } findNearestNode(position) { let nearestNode = null; let minDistance = Infinity; for (const node of this.navMesh.grid) { const distance = position.distanceTo(node); if (distance < minDistance) { minDistance = distance; nearestNode = node; } } return nearestNode; } heuristic(a, b) { return a.distanceTo(b); } getNeighbors(node) { return this.navMesh.grid.filter(neighbor => Math.abs(neighbor.x - node.x) <= this.navMesh.gridSize && Math.abs(neighbor.z - node.z) <= this.navMesh.gridSize && neighbor !== node ); } findPath(start, goal) { const openSet = [start]; const cameFrom = new Map(); const gScore = new Map(); const fScore = new Map(); gScore.set(start, 0); fScore.set(start, this.heuristic(start, goal)); while (openSet.length > 0) { const current = openSet.reduce((a, b) => fScore.get(a) < fScore.get(b) ? a : b); if (current.equals(goal)) { return this.reconstructPath(cameFrom, current); } openSet.splice(openSet.indexOf(current), 1); for (const neighbor of this.getNeighbors(current)) { const tentativeGScore = gScore.get(current) + current.distanceTo(neighbor); if (!gScore.has(neighbor) || tentativeGScore < gScore.get(neighbor)) { cameFrom.set(neighbor, current); gScore.set(neighbor, tentativeGScore); fScore.set(neighbor, gScore.get(neighbor) + this.heuristic(neighbor, goal)); if (!openSet.includes(neighbor)) { openSet.push(neighbor); } } } } return null; // No path found } reconstructPath(cameFrom, current) { const path = [current]; while (cameFrom.has(current)) { current = cameFrom.get(current); path.unshift(current); } return path; } visualizePath(path) { // Create a tube geometry for a consistently thick line const tubeGeometry = new THREE.TubeGeometry( new THREE.CatmullRomCurve3(path), path.length * 10, // number of tube segments 0.1, // tube radius 8, // number of radial segments false // closed curve ); const tubeMaterial = new THREE.MeshBasicMaterial({ color: 0x0000ff // Blue color }); const tubeMesh = new THREE.Mesh(tubeGeometry, tubeMaterial); tubeMesh.position.y = 0.2; // Slightly above the ground WorldScene.add(tubeMesh); return tubeMesh; } } class InputHandler { constructor() { this.keys = { w: false, a: false, s: false, d: false }; this.mouseDown = false; this.initKeyboardListeners(); this.raycaster = new THREE.Raycaster(); this.mouse = new THREE.Vector2(); this.initMouseListeners(); } // initControls method removed initKeyboardListeners() { document.addEventListener('keydown', (event) => this.onKeyDown(event)); document.addEventListener('keyup', (event) => this.onKeyUp(event)); } onKeyDown(event) { if (event.key in this.keys) { this.keys[event.key] = true; } } onKeyUp(event) { if (event.key in this.keys) { this.keys[event.key] = false; } } update() { this.updateRaycaster(); } initMouseListeners() { GameRenderer.renderer.domElement.addEventListener('mousemove', (event) => this.onMouseMove(event)); GameRenderer.renderer.domElement.addEventListener('mousedown', () => this.mouseDown = true); GameRenderer.renderer.domElement.addEventListener('mouseup', () => this.mouseDown = false); GameRenderer.renderer.domElement.addEventListener('mouseleave', () => this.mouseDown = false); } onMouseMove(event) { const rect = GameRenderer.renderer.domElement.getBoundingClientRect(); this.mouse.x = ((event.clientX - rect.left) / rect.width) * 2 - 1; this.mouse.y = -((event.clientY - rect.top) / rect.height) * 2 + 1; } updateRaycaster() { this.raycaster.setFromCamera(this.mouse, MainCamera); if (GameWorld && GameWorld.tileMap) { const tileMapMesh = GameWorld.tileMap.render(); const intersects = this.raycaster.intersectObjects(tileMapMesh.children, true); if (intersects.length > 0) { const intersectionPoint = intersects[0].point; // Update player facing direction if (window.Player) { window.Player.updateFacingDirection(intersectionPoint); } // You can add additional logic here for cursor indication if needed } } } } class App { constructor() { this.createRenderDivs(); this.clock = new THREE.Clock(); this.initialLoadingComplete = false; this.spriteSheet = null; this.deltaTime = 0; this.init(); } init() { window.LoadingManager = new THREE.LoadingManager(); this.setupLoadingManager(); window.Textures = TextureManager(); window.Materials = MaterialManager(); window.Meshes = MeshManager(); window.Lights = LightingManager(); window.GameWorld = new World(); window.Input = new InputHandler(); // Initialize AudioManager window.AudioManager = new AudioManager(); // Initialize BulletManager globally window.BulletManager = new BulletManager(); // Initialize EnemySpawner window.EnemySpawner = new EnemySpawner(); // Initialize EnemyManager globally window.EnemyManager = new EnemyManager(GameWorld); // Create the player as a global reference only if the control variable is true if (APP_SETTINGS.controls.createPlayerOnBoot) { window.Player = new Player(GameWorld); console.log("Player created on boot."); } else { console.log("Player creation on boot is disabled."); } // Create tilemap if the control variable is true if (APP_SETTINGS.controls.generateTileMap) { GameWorld.createTileMap(); } // Set up GameWorld reference for other components if (window.Player) window.Player.world = GameWorld; if (window.Enemy) window.Enemy.prototype.world = GameWorld; if (window.Bullet) window.Bullet.prototype.world = GameWorld; if (window.Gun) window.Gun.prototype.world = GameWorld; if (window.AudioManager) { GameWorld.audioManager = window.AudioManager; console.log('AudioManager reference set up for GameWorld'); } console.log('GameWorld reference set up for components'); // Create a single enemy only if the control variable is true if (APP_SETTINGS.controls.createSingleEnemyOnBoot) { window.EnemyManager.createEnemy(new THREE.Vector3(6, -19.5, 6)); console.log("Single enemy created on boot."); } else { console.log("Single enemy creation on boot is disabled."); } // Start the first wave only if the control variable is true if (APP_SETTINGS.controls.startEnemyWavesOnBoot) { window.EnemySpawner.startWave(); } else { console.log("Enemy wave start is disabled. Set APP_SETTINGS.controls.startEnemyWavesOnBoot to true to enable."); } // Wait for textures to load before creating UI elements this.waitForTexturesAndInitUI(); this.addEventListeners(); } waitForTexturesAndInitUI() { Textures.loadTextures().then(() => { console.log('All textures loaded successfully'); // Initialize other UI elements here if needed }).catch(error => { console.error('Error loading textures:', error); }); } setupLoadingManager() { LoadingManager.onProgress = (url, itemsLoaded, itemsTotal) => { const progress = (itemsLoaded / itemsTotal * 100).toFixed(0); loadingScreen.innerHTML = `Loading... ${progress}%`; }; LoadingManager.onLoad = () => { this.initialLoadingComplete = true; loadingScreen.style.display = 'none'; if (GameWorld) { // Check if the skybox has been loaded if (GameWorld.skybox.skyMesh) { console.log("Skybox loaded successfully"); } else { console.warn("Skybox not loaded yet"); } } }; LoadingManager.onError = (url) => { console.error('Error loading:', url); }; } addEventListeners() { addEventListener('resize', this.onWindowResize.bind(this)); const resizeObserver = new ResizeObserver(this.onWindowResize.bind(this)); resizeObserver.observe(parentDiv); } onWindowResize() { const width = parentDiv.clientWidth; const height = parentDiv.clientHeight; if (GameWorld) { MainCamera.aspect = width / height; MainCamera.updateProjectionMatrix(); GameRenderer.setSize(width, height); } } animate() { requestAnimationFrame(this.animate.bind(this)); this.deltaTime = Math.min(this.clock.getDelta(), 0.1); if (this.initialLoadingComplete) { GameWorld.update(this.deltaTime); Input.update(); if (window.Player) { window.Player.update(); } if (this.worldClock) { this.worldClock.update(GameWorld.Time); } else { //console.warn('WorldClock not initialized'); } Input.updateRaycaster(); // Update the raycaster in each frame window.EnemySpawner.update(this.deltaTime); // Update the EnemySpawner } } start() { this.animate(); } createRenderDivs() { // Can create global variables by assigning them to window.variableName. window.parentDiv = document.getElementById('renderDiv'); window.canvas = document.getElementById('threeRenderCanvas'); window.loadingScreen = document.createElement('div'); if (!canvas) { canvas = document.createElement('canvas'); canvas.id = 'threeRenderCanvas'; parentDiv.appendChild(canvas); } // Create loading screen loadingScreen.style.position = 'absolute'; loadingScreen.style.top = '0'; loadingScreen.style.left = '0'; loadingScreen.style.width = '100%'; loadingScreen.style.height = '100%'; loadingScreen.style.backgroundColor = 'rgba(0, 0, 0, 0.8)'; loadingScreen.style.color = 'white'; loadingScreen.style.display = 'flex'; loadingScreen.style.justifyContent = 'center'; loadingScreen.style.alignItems = 'center'; loadingScreen.style.fontSize = '24px'; loadingScreen.innerHTML = 'Loading... 0%'; parentDiv.appendChild(loadingScreen); window.uiDiv = document.createElement('div'); uiDiv.id = 'uiDiv'; uiDiv.style.position = 'absolute'; uiDiv.style.top = '0'; uiDiv.style.left = '0'; uiDiv.style.width = '100%'; uiDiv.style.height = '100%'; uiDiv.style.pointerEvents = 'none'; // Set to 'none' to allow events to pass through uiDiv.style.userSelect = 'none'; // Disable text selection uiDiv.style.webkitUserSelect = 'none'; // For Safari uiDiv.style.msUserSelect = 'none'; // For IE/Edge // Apply the same styles to parentDiv parentDiv.style.userSelect = 'none'; parentDiv.style.webkitUserSelect = 'none'; parentDiv.style.msUserSelect = 'none'; parentDiv.appendChild(uiDiv); } } class AudioManager { constructor() { this.audioContext = new(window.AudioContext || window.webkitAudioContext)(); this.sounds = new Map(); this.music = null; this.musicGainNode = this.audioContext.createGain(); this.sfxGainNode = this.audioContext.createGain(); this.musicGainNode.connect(this.audioContext.destination); this.sfxGainNode.connect(this.audioContext.destination); this.loadSounds(); } loadSounds() { const loadPromises = []; for (const category in SOUND_ASSETS) { for (const soundName in SOUND_ASSETS[category]) { const soundData = SOUND_ASSETS[category][soundName]; loadPromises.push(this.loadSound(soundName, soundData.url, soundData.volume)); } } return Promise.all(loadPromises) .then(() => console.log('All sounds loaded successfully')) .catch(error => console.error('Error loading sounds:', error)); } loadSound(key, url, volume) { return fetch(url) .then(response => response.arrayBuffer()) .then(arrayBuffer => this.audioContext.decodeAudioData(arrayBuffer)) .then(audioBuffer => { this.sounds.set(key, { buffer: audioBuffer, volume: volume }); console.log(`Sound loaded: ${key}`); }) .catch(error => console.error('Error loading sound:', error)); } playSound(key, loop = false) { const soundData = this.sounds.get(key); if (soundData) { const source = this.audioContext.createBufferSource(); source.buffer = soundData.buffer; source.loop = loop; const gainNode = this.audioContext.createGain(); gainNode.gain.setValueAtTime(soundData.volume, this.audioContext.currentTime); source.connect(gainNode); gainNode.connect(this.sfxGainNode); source.start(); return source; } else { console.warn(`Sound not found: ${key}`); return null; } } playMusic(key) { const music = this.sounds.get(key); if (music) { if (this.music) { this.music.stop(); } this.music = this.audioContext.createBufferSource(); this.music.buffer = music; this.music.loop = true; this.music.connect(this.musicGainNode); this.music.start(); } else { console.warn(`Music not found: ${key}`); } } stopMusic() { if (this.music) { this.music.stop(); this.music = null; } } setMusicVolume(volume) { this.musicGainNode.gain.setValueAtTime(volume, this.audioContext.currentTime); } setSFXVolume(volume) { this.sfxGainNode.gain.setValueAtTime(volume, this.audioContext.currentTime); } } class EnemySpawner { static SPAWN_CONFIG = { spawnPositions: [ new THREE.Vector3(6, -19.5, 6), new THREE.Vector3(-6, -19.5, -6), new THREE.Vector3(6, -19.5, -6) ], waves: [{ enemyCount: 5, spawnInterval: 1 }, { enemyCount: 7, spawnInterval: 0.5 }] }; constructor() { this.currentWave = 0; this.enemiesSpawned = 0; this.enemiesRemaining = 0; this.timeSinceLastSpawn = 0; this.isSpawning = false; } startWave() { if (this.currentWave < EnemySpawner.SPAWN_CONFIG.waves.length) { this.isSpawning = true; this.enemiesSpawned = 0; this.enemiesRemaining = EnemySpawner.SPAWN_CONFIG.waves[this.currentWave].enemyCount; console.log(`Starting wave ${this.currentWave + 1}`); } else { console.log("All waves completed!"); } } update(deltaTime) { if (!this.isSpawning) return; this.timeSinceLastSpawn += deltaTime; const currentWaveConfig = EnemySpawner.SPAWN_CONFIG.waves[this.currentWave]; if (this.timeSinceLastSpawn >= currentWaveConfig.spawnInterval && this.enemiesSpawned < currentWaveConfig.enemyCount) { this.spawnEnemy(); this.timeSinceLastSpawn = 0; } this.checkWaveCompletion(); } spawnEnemy() { const spawnPositions = EnemySpawner.SPAWN_CONFIG.spawnPositions; const randomPosition = spawnPositions[Math.floor(Math.random() * spawnPositions.length)]; window.EnemyManager.createEnemy(randomPosition); this.enemiesSpawned++; } notifyEnemyDeath() { this.enemiesRemaining--; this.checkWaveCompletion(); } checkWaveCompletion() { const currentWaveConfig = EnemySpawner.SPAWN_CONFIG.waves[this.currentWave]; if (this.enemiesSpawned >= currentWaveConfig.enemyCount && this.enemiesRemaining === 0) { this.completeWave(); } } completeWave() { console.log(`Wave ${this.currentWave + 1} completed!`); this.currentWave++; this.isSpawning = false; if (this.currentWave < EnemySpawner.SPAWN_CONFIG.waves.length) { this.startWave(); } else { console.log("All waves completed!"); } } } class Tile { constructor(x, z) { this.x = x; this.z = z; this.mesh = this.createMesh(); this.body = this.createPhysicsBody(); } createMesh() { const config = APP_SETTINGS.TILEMAP_CONFIG; const geometry = new THREE.PlaneGeometry(config.tileSize, config.tileSize); const material = Materials.getMaterial('tileMaterial'); const mesh = new THREE.Mesh(geometry, material); const offsetX = (config.width * config.tileSize) / 2; const offsetZ = (config.height * config.tileSize) / 2; mesh.position.set( this.x * config.tileSize - offsetX + config.tileSize / 2, config.baseHeight, this.z * config.tileSize - offsetZ + config.tileSize / 2 ); mesh.rotation.x = -Math.PI / 2; // Rotate to lay flat mesh.receiveShadow = true; mesh.userData.isRaycastable = true; // Mark the tile as raycastable if (APP_SETTINGS.controls.debugMapGenerator) { console.log(`Created tile at (${this.x * config.tileSize}, ${config.baseHeight}, ${this.z * config.tileSize})`); } return mesh; } createPhysicsBody() { const config = APP_SETTINGS.TILEMAP_CONFIG; const shape = new CANNON.Box(new CANNON.Vec3(config.tileSize / 2, 0.1, config.tileSize / 2)); const tileMaterial = new CANNON.Material('tileMaterial'); const offsetX = (config.width * config.tileSize) / 2; const offsetZ = (config.height * config.tileSize) / 2; const body = new CANNON.Body({ mass: 0, // Static body shape: shape, position: new CANNON.Vec3( this.x * config.tileSize - offsetX + config.tileSize / 2, config.baseHeight, this.z * config.tileSize - offsetZ + config.tileSize / 2 ), material: tileMaterial, collisionFilterGroup: APP_SETTINGS.physics.collisionGroups.default, collisionFilterMask: -1 // Collide with everything }); body.quaternion.setFromAxisAngle(new CANNON.Vec3(1, 0, 0), -Math.PI / 2); // Create contact material between tile and player const playerMaterial = new CANNON.Material('playerMaterial'); const tilePlayerContact = new CANNON.ContactMaterial(tileMaterial, playerMaterial, { friction: APP_SETTINGS.physics.defaultContactMaterial.friction, restitution: APP_SETTINGS.physics.defaultContactMaterial.restitution }); GameWorld.physicsWorld.addContactMaterial(tilePlayerContact); if (APP_SETTINGS.controls.debugMapGenerator) { console.log(`Created physics body for tile at (${this.x * config.tileSize}, ${config.baseHeight}, ${this.z * config.tileSize})`); } return body; } } class TileMap { constructor() { const config = APP_SETTINGS.TILEMAP_CONFIG; this.width = config.width; this.height = config.height; this.tiles = []; this.mapMesh = new THREE.Group(); this.createTiles(); } createTiles() { for (let x = 0; x < this.width; x++) { for (let z = 0; z < this.height; z++) { const tile = new Tile(x, z); this.tiles.push(tile); this.mapMesh.add(tile.mesh); // Add the tile's physics body to the physics world GameWorld.physicsWorld.addBody(tile.body); } } if (APP_SETTINGS.controls.debugMapGenerator) { console.log(`Created ${this.tiles.length} tiles and added their physics bodies to the world`); } } getTileAt(x, z) { return this.tiles.find(tile => tile.x === x && tile.z === z); } render() { return this.mapMesh; } } class TileMapGenerator { constructor() { const config = APP_SETTINGS.TILEMAP_CONFIG; this.width = config.width; this.height = config.height; } generateMap() { this.createTileMaterial(); const tilemap = new TileMap(); if (APP_SETTINGS.controls.debugMapGenerator) { console.log(`Generated tilemap of size ${this.width}x${this.height}`); } return tilemap; } createTileMaterial() { const materialParams = { color: APP_SETTINGS.world.defaults.groundColor, }; Materials.create('tileMaterial', 'basic', materialParams); } createGridLines(tilemap) { const config = APP_SETTINGS.TILEMAP_CONFIG; const material = new THREE.LineBasicMaterial({ color: config.gridLineColor }); const points = []; const offsetX = (this.width * config.tileSize) / 2; const offsetZ = (this.height * config.tileSize) / 2; for (let x = 0; x <= this.width; x++) { const xPos = x * config.tileSize - offsetX; points.push(new THREE.Vector3(xPos, config.gridLineHeight, -offsetZ)); points.push(new THREE.Vector3(xPos, config.gridLineHeight, offsetZ)); } for (let z = 0; z <= this.height; z++) { const zPos = z * config.tileSize - offsetZ; points.push(new THREE.Vector3(-offsetX, config.gridLineHeight, zPos)); points.push(new THREE.Vector3(offsetX, config.gridLineHeight, zPos)); } const geometry = new THREE.BufferGeometry().setFromPoints(points); const gridLines = new THREE.LineSegments(geometry, material); if (APP_SETTINGS.controls.debugMapGenerator) { console.log(`Created grid lines for map visualization at height ${config.gridLineHeight}`); } return gridLines; } } window.Game = new App(); Game.start();