// 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 simfplest 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 }, sunMovement: false, // New control variable for sun movement colorSpace: { output: THREE.SRGBColorSpace, toneMapping: THREE.ACESFilmicToneMapping, toneMappingExposure: 1.2 }, antialias: true, pixelRatio: window.devicePixelRatio }, controls: { startEnemyWavesOnBoot: false, createSingleEnemyOnBoot: true, enableEnemyAttackingState: true, generateTileMap: true, enableEnemyPathfinding: true, showMapEditorUI: false, visualizeNavMesh: false, visualizeEnemyPaths: false, debugEnemy: false, useBulletEnemyCollisionGroups: false, debugBulletRaycast: true, // New control variable for bullet raycast debugging }, enemySpawner: { waves: [{ enemyCount: 5, spawnInterval: 1 }, { enemyCount: 8, spawnInterval: 0.8 }, { enemyCount: 12, spawnInterval: 0.6 }], tileFlashInterval: 1.2, // New setting for tile flash interval (in seconds timeBetweenWaves: 3, // 3 seconds between waves spawnSettings: { minDistanceFromPlayer: 10, maxSpawnAttempts: 10 } }, TILEMAP_CONFIG: { width: 12, height: 10, tileSize: 2, baseHeight: -21.5, gridLineHeight: -21.4, // slightly above base height gridLineColor: 0x000000, obstacleCount: 1, // New configuration for number of obstacles obstacleForegroundColor: 0xB637C8, // RGB(182, 55, 200) for the foreground obstacleBackgroundColor: 0x4A4A4A, // RGB(74, 74, 74) for the background groundColor: 0xF0F0F0, // Bright off-white color obstacleMinHeight: 3, // Minimum height for obstacles obstacleMaxHeight: 7, // Maximum height for obstacles }, world: { defaults: { skyColor: 0x4A6D8C // Darker blue color }, }, 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; } } ) ); } } Promise.all(texturePromises) .then((loadedTextures) => { this.texturesLoaded = true; 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; } 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.skyColor).multiplyScalar(0.5); // Darker version of sky color for ground 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; } createTileMap() { const { tileMap, gridLines } = window.TileMapManager.createTileMap(); this.tileMap = tileMap; this.gridLines = gridLines; } destroyMap() { window.TileMapManager.destroyMap(); this.tileMap = null; this.gridLines = null; } regenerateMap() { window.TileMapManager.regenerateMap(); const currentMap = window.TileMapManager.getCurrentMap(); this.tileMap = currentMap; this.gridLines = currentMap ? currentMap.gridLines : null; } 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) { if (APP_SETTINGS.renderer.sunMovement) { 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 tilemap console.log('Camera initialized with top-down view'); } initRenderer() { window.GameRenderer = new Renderer(MainCamera); GameRenderer.initPostProcessing(WorldScene); } update(deltaTime) { this.deltaTime = deltaTime; // Store deltaTime for use in other methods 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); if (window.Player) { window.Player.update(deltaTime); } // Update enemies window.EnemyManager.updateEnemies(deltaTime); // Update bullets using global BulletManager window.BulletManager.update(deltaTime); if (window.Player && window.Player.gun) { window.Player.gun.update(deltaTime); } // Update tilemap if (this.tileMap) { this.tileMap.update(deltaTime); } // Process enemy removal queue at the end of the update loop window.EnemyManager.processRemovalQueue(); GameRenderer.render(); } } class NavMesh { constructor(tileMap) { this.tileMap = tileMap; this.grid = []; this.skippedPoints = []; this.visualizationGroup = new THREE.Group(); this.generateGrid(); if (APP_SETTINGS.controls.visualizeNavMesh) { this.createVisualization(); } } generateGrid() { const config = APP_SETTINGS.TILEMAP_CONFIG; const offsetX = (this.tileMap.width * config.tileSize) / 2; const offsetZ = (this.tileMap.height * config.tileSize) / 2; const quarterTileSize = config.tileSize / 4; for (let x = 0; x <= this.tileMap.width; x += 2) { for (let z = 0; z <= this.tileMap.height; z += 2) { const baseX = x * config.tileSize - offsetX; const baseZ = z * config.tileSize - offsetZ; // Add points for each tile (including quarter points) for (let dx = 0; dx <= 4; dx += 2) { for (let dz = 0; dz <= 4; dz += 2) { // Skip the points that are outside the map if (x === this.tileMap.width && dx > 0) continue; if (z === this.tileMap.height && dz > 0) continue; const pointX = baseX + dx * quarterTileSize; const pointZ = baseZ + dz * quarterTileSize; this.addPoint(pointX, pointZ, config.baseHeight); } } } } console.log(`Generated ${this.grid.length} NavMesh points`); } addPoint(x, z, y) { const point = new THREE.Vector3(x, y + 0.1, z); if (!this.isPointOverlappingObstacle(point)) { this.grid.push(point); } else { this.skippedPoints.push(point); } } isPointOverlappingObstacle(point) { const buffer = .5; return this.tileMap.obstacles.some(obstacle => { const obstaclePosition = obstacle.mesh.position; const obstacleSize = obstacle.mesh.geometry.parameters; return ( point.x >= obstaclePosition.x - obstacleSize.width / 2 - buffer && point.x <= obstaclePosition.x + obstacleSize.width / 2 + buffer && point.z >= obstaclePosition.z - obstacleSize.depth / 2 - buffer && point.z <= obstaclePosition.z + obstacleSize.depth / 2 + buffer ); }); } createVisualization() { const sphereGeometry = new THREE.SphereGeometry(0.05, 8, 8); // Smaller spheres const sphereMaterial = new THREE.MeshBasicMaterial({ color: 0x0000ff }); this.grid.forEach(point => { const sphere = new THREE.Mesh(sphereGeometry, sphereMaterial); sphere.position.copy(point); this.visualizationGroup.add(sphere); }); WorldScene.add(this.visualizationGroup); } removeVisualization() { if (this.visualizationGroup) { WorldScene.remove(this.visualizationGroup); this.visualizationGroup.clear(); } } } 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 // New properties for raycasting this.raycaster = new THREE.Raycaster(); this.rayVisualization = this.createRayVisualization(); this.hasLoggedDebugInfo = false; // Flag to ensure debug info is logged only once } createRayVisualization() { const geometry = new THREE.BufferGeometry().setFromPoints([ new THREE.Vector3(0, 0, 0), new THREE.Vector3(0, 0, 0.5) // Reduce ray length by 1/2 ]); const material = new THREE.LineBasicMaterial({ color: 0x00ff00, linewidth: 3 // Increase ray size by 3x (note: linewidth may not work in WebGL) }); const line = new THREE.Line(geometry, material); WorldScene.add(line); return line; } 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) { 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.controls.useBulletEnemyCollisionGroups ? APP_SETTINGS.physics.collisionGroups.bullet : APP_SETTINGS.physics.collisionGroups.default, collisionFilterMask: APP_SETTINGS.controls.useBulletEnemyCollisionGroups ? (APP_SETTINGS.physics.collisionGroups.enemy | APP_SETTINGS.physics.collisionGroups.obstacle) : APP_SETTINGS.physics.collisionGroups.obstacle }); if (APP_SETTINGS.controls.useBulletEnemyCollisionGroups) { 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; } } else if (otherBody.collisionFilterGroup === APP_SETTINGS.physics.collisionGroups.obstacle) { // Play bullet hit sound for obstacle collision if (window.AudioManager) { window.AudioManager.playSound('bullet_hit'); } console.log("Bullet collided with an obstacle"); } // Queue the bullet for removal regardless of what it hit 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; // Perform raycast this.performRaycast(); // Update ray visualization this.updateRayVisualization(); } performRaycast() { const shortRayDirection = this.initialDirection.clone().normalize().multiplyScalar(0.5); // 0.5 units long this.raycaster.set(this.mesh.position, shortRayDirection); const intersects = this.raycaster.intersectObjects(WorldScene.children, true); if (APP_SETTINGS.controls.debugBulletRaycast && !this.hasLoggedDebugInfo) { console.log('Bullet Raycast Debug:'); console.log('Bullet position:', this.mesh.position); console.log('Bullet direction:', shortRayDirection); console.log('Intersects:', intersects); this.hasLoggedDebugInfo = true; } for (let intersect of intersects) { if (intersect.object.userData.isEnemy) { // Handle enemy collision this.handleEnemyCollision(intersect.object.userData.enemy); break; } } } handleEnemyCollision(enemy) { if (!enemy) { console.warn('Attempted to handle collision with undefined enemy'); return; } if (!this.hasDamaged) { if (typeof enemy.takeDamage === 'function') { enemy.takeDamage(this.damage); this.hasDamaged = true; if (window.AudioManager) { window.AudioManager.playSound('bullet_hit'); } this.bulletManager.queueForRemoval(this); } else { console.warn('Enemy object does not have a takeDamage method'); } } } updateRayVisualization() { const shortRayDirection = this.initialDirection.clone().normalize().multiplyScalar(0.5); // 0.5 units long const endPoint = this.mesh.position.clone().add(shortRayDirection); this.rayVisualization.geometry.setFromPoints([this.mesh.position, endPoint]); this.rayVisualization.geometry.verticesNeedUpdate = true; } remove() { WorldScene.remove(this.mesh); WorldScene.remove(this.rayVisualization); 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.findSpawnPoint(); this.createMesh(); this.createBody(); this.createGun(); } findSpawnPoint() { const tileMap = this.world.tileMap; if (!tileMap) { console.warn("TileMap not found. Using default spawn point."); this.spawnPoint = new THREE.Vector3(0, APP_SETTINGS.TILEMAP_CONFIG.baseHeight + 2, 0); return; } const config = APP_SETTINGS.TILEMAP_CONFIG; const offsetX = (tileMap.width * config.tileSize) / 2; const offsetZ = (tileMap.height * config.tileSize) / 2; for (let x = 0; x < tileMap.width; x++) { for (let z = 0; z < tileMap.height; z++) { const worldX = x * config.tileSize - offsetX + config.tileSize / 2; const worldZ = z * config.tileSize - offsetZ + config.tileSize / 2; const position = new THREE.Vector3(worldX, config.baseHeight + 2, worldZ); // Check if the position is not occupied by an obstacle if (!tileMap.obstacles.some(obstacle => obstacle.mesh.position.x === position.x && obstacle.mesh.position.z === position.z)) { this.spawnPoint = position; return; } } } console.warn("No suitable spawn point found. Using default spawn point."); this.spawnPoint = new THREE.Vector3(0, APP_SETTINGS.TILEMAP_CONFIG.baseHeight + 2, 0); } 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: 0xDB6FC9, // Lighter pink color roughness: 0.7, metalness: 0.3 }); this.mesh = new THREE.Mesh(geometry, material); this.mesh.castShadow = true; this.mesh.position.copy(this.spawnPoint); WorldScene.add(this.mesh); // Player mesh created } 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, 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.copy(this.spawnPoint); 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); // Player body created } 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, enemyManager, id) { this.world = world; this.mesh = null; this.body = null; this.id = id; this.createMesh(position); this.createBody(position); this.pathUpdateInterval = .25; // Update path every 0.5 seconds this.lastPathUpdateTime = 0; this.currentPath = null; this.moveSpeed = 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(); this.debugLogInterval = 1; // Log debug info every 1 second this.lastDebugLogTime = 0; this.astar = new AStar(this.world.tileMap); this.lerpFactor = 0.33; } 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)); } } visualizePath() { if (this.pathVisualization) { WorldScene.remove(this.pathVisualization); this.pathVisualization = null; } if (APP_SETTINGS.controls.visualizeEnemyPaths && this.currentPath && this.currentPath.length > 1) { const material = new THREE.LineBasicMaterial({ color: 0xff0000 }); const geometry = new THREE.BufferGeometry().setFromPoints(this.currentPath); this.pathVisualization = new THREE.Line(geometry, material); WorldScene.add(this.pathVisualization); } } 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.mesh.userData.isEnemy = true; this.mesh.userData.enemy = this; this.mesh.raycastable = 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.controls.useBulletEnemyCollisionGroups ? APP_SETTINGS.physics.collisionGroups.enemy : APP_SETTINGS.physics.collisionGroups.default, collisionFilterMask: APP_SETTINGS.controls.useBulletEnemyCollisionGroups ? (APP_SETTINGS.physics.collisionGroups.default | APP_SETTINGS.physics.collisionGroups.obstacle | APP_SETTINGS.physics.collisionGroups.bullet) : (APP_SETTINGS.physics.collisionGroups.default | APP_SETTINGS.physics.collisionGroups.obstacle), linearDamping: 0.1, angularDamping: 0.1 }); this.setPosition(position); const enemyGroundContact = new CANNON.ContactMaterial( enemyMaterial, this.world.groundPhysMaterial, { friction: 0.001, restitution: 0, contactEquationStiffness: 1e8, contactEquationRelaxation: 3 } ); this.world.physicsWorld.addContactMaterial(enemyGroundContact); this.body.collisionResponse = 1; // Ensure collision response is enabled this.world.physicsWorld.addBody(this.body); } update(deltaTime) { if (this.isDead) return; if (!this.isLunging) { this.setPosition(this.body.position); this.mesh.quaternion.copy(this.body.quaternion); } 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; } } this.executeStateAction(deltaTime); if (APP_SETTINGS.controls.debugEnemy) { this.lastDebugLogTime += deltaTime; if (this.lastDebugLogTime >= this.debugLogInterval) { this.logDebugInfo(); this.lastDebugLogTime = 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 { 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) { 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 if (window.AudioManager) { window.AudioManager.playSound('enemy_attack'); } } this.attackTimer += deltaTime; const attackProgress = this.attackTimer / this.attackDuration; let newPosition; if (attackProgress <= 0.5) { newPosition = this.lerpPosition(this.originalPosition, this.targetPosition, attackProgress * 2); } else { newPosition = this.lerpPosition(this.targetPosition, this.originalPosition, (attackProgress - 0.5) * 2); } this.setPosition(newPosition); if (this.attackTimer >= this.attackDuration) { 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) { switch (newState) { case this.states.ATTACKING: this.attackTimer = 0; this.setColor(0xFF6666); // Lighter red color for attacking state this.body.velocity.setZero(); // Stop ongoing movement break; case this.states.CHASING: break; } } onExitState(oldState) { switch (oldState) { case this.states.ATTACKING: this.setColor(0x00FF00); // Green color when exiting attacking state this.isLunging = false; break; case this.states.CHASING: 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.tileMap) { return; } const startNode = this.astar.findNearestNode(this.mesh.position); const goalNode = this.astar.findNearestNode(window.Player.mesh.position); if (!startNode || !goalNode) { return; } this.currentPath = this.astar.findPath(startNode, goalNode); if (APP_SETTINGS.controls.visualizeEnemyPaths) { this.visualizePath(); } } logDebugInfo() {} moveAlongPath(deltaTime) { if (!this.currentPath || this.currentPathIndex >= this.currentPath.length) { return; } const targetPosition = this.currentPath[this.currentPathIndex]; const currentPos = this.body.position; const lerpedPosition = new CANNON.Vec3( currentPos.x + (targetPosition.x - currentPos.x) * this.lerpFactor, currentPos.y, currentPos.z + (targetPosition.z - currentPos.z) * this.lerpFactor ); const direction = lerpedPosition.vsub(currentPos).unit(); const desiredVelocity = direction.scale(this.moveSpeed); this.body.velocity.set(desiredVelocity.x, this.body.velocity.y, desiredVelocity.z); const distanceToTarget = currentPos.distanceTo(new CANNON.Vec3(targetPosition.x, currentPos.y, targetPosition.z)); if (distanceToTarget < 1) { // Smaller threshold for more precise movement this.currentPathIndex++; if (this.currentPathIndex >= this.currentPath.length) { this.body.velocity.setZero(); this.calculatePathToPlayer(); } } } } class EnemyManager { constructor(world) { this.world = world; this.enemies = []; this.removalQueue = []; this.totalEnemiesSpawned = 0; } createEnemy(position) { this.totalEnemiesSpawned++; const enemy = new Enemy(this.world, position, this, this.totalEnemiesSpawned); 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 AStar { constructor(tileMap) { this.tileMap = tileMap; } findNearestNode(position) { let nearestNode = null; let minDistance = Infinity; for (const node of this.tileMap.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) { const gridSize = APP_SETTINGS.TILEMAP_CONFIG.tileSize; return this.tileMap.navMesh.grid.filter(neighbor => Math.abs(neighbor.x - node.x) <= gridSize && Math.abs(neighbor.z - node.z) <= 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; } reconstructPath(cameFrom, current) { const path = [current]; while (cameFrom.has(current)) { current = cameFrom.get(current); path.unshift(current); } return path; } visualizePath(path) { 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', (event) => { if (!this.isOverMapEditorUI(event)) { this.mouseDown = true; } }); GameRenderer.renderer.domElement.addEventListener('mouseup', () => this.mouseDown = false); GameRenderer.renderer.domElement.addEventListener('mouseleave', () => this.mouseDown = false); } isOverMapEditorUI(event) { const mapEditorUI = document.getElementById('mapEditorUI'); if (mapEditorUI) { const rect = mapEditorUI.getBoundingClientRect(); return ( event.clientX >= rect.left && event.clientX <= rect.right && event.clientY >= rect.top && event.clientY <= rect.bottom ); } return 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; if (window.Player) { window.Player.updateFacingDirection(intersectionPoint); } } } } } class GameUIManager { constructor() { this.hud = null; this.infoElement = null; } init() { this.createHUD(); } createHUD() { this.hud = document.createElement('div'); this.hud.id = 'gameHUD'; this.hud.style.cssText = ` position: absolute; top: 0; left: 0; width: 100%; padding: 10px; background-color: rgba(0, 0, 0, 0.5); color: white; font-size: 24px; font-family: Arial, sans-serif; display: flex; justify-content: center; align-items: center; z-index: 1000; `; this.infoElement = document.createElement('div'); this.infoElement.id = 'gameInfo'; this.infoElement.style.cssText = ` text-align: center; `; this.hud.appendChild(this.infoElement); document.body.appendChild(this.hud); } update(deltaTime) { if (window.EnemySpawner) { let infoText; switch (window.EnemySpawner.isWaitingBetweenWaves) { case true: const remainingTime = Math.ceil(APP_SETTINGS.enemySpawner.timeBetweenWaves - window.EnemySpawner.waveTimer); infoText = `Next wave in: ${remainingTime}s`; break; case false: const currentWave = window.EnemySpawner.currentWave + 1; const totalWaves = APP_SETTINGS.enemySpawner.waves.length; infoText = `Wave: ${currentWave}/${totalWaves}`; break; } this.infoElement.textContent = infoText; } } } 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(); window.AudioManager = new AudioManager(); window.BulletManager = new BulletManager(); window.EnemySpawner = new EnemySpawner(); window.EnemyManager = new EnemyManager(GameWorld); window.TileMapManager = new TileMapManager(); if (APP_SETTINGS.controls.generateTileMap) { GameWorld.createTileMap(); } window.Player = new Player(GameWorld); 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'); } if (APP_SETTINGS.controls.createSingleEnemyOnBoot) { window.EnemyManager.createEnemy(new THREE.Vector3(6, -19.5, 6)); } if (APP_SETTINGS.controls.startEnemyWavesOnBoot) { window.EnemySpawner.startWave(); } this.waitForTexturesAndInitUI(); this.addEventListeners(); window.GameUIManager = new GameUIManager(); window.GameUIManager.init(); this.createMapEditorUI(); this.setupUIEventListeners(); } waitForTexturesAndInitUI() { Textures.loadTextures().then(() => { console.log('All textures loaded successfully'); }).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 window.GameUIManager.update(this.deltaTime); // Update the GameUIManager } } start() { this.animate(); } createRenderDivs() { 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); } 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.userSelect = 'none'; // Disable text selection uiDiv.style.webkitUserSelect = 'none'; // For Safari uiDiv.style.msUserSelect = 'none'; // For IE/Edge uiDiv.style.pointerEvents = 'none'; // Initially set to none // Apply the same styles to parentDiv parentDiv.style.userSelect = 'none'; parentDiv.style.webkitUserSelect = 'none'; parentDiv.style.msUserSelect = 'none'; parentDiv.appendChild(uiDiv); this.setupUIEventListeners(); } setupUIEventListeners() { const mapEditorUI = document.getElementById('mapEditorUI'); if (mapEditorUI) { mapEditorUI.addEventListener('mouseenter', () => this.toggleCanvasPointerEvents(false)); mapEditorUI.addEventListener('mouseleave', () => this.toggleCanvasPointerEvents(true)); } } toggleCanvasPointerEvents(enable) { if (canvas) { canvas.style.pointerEvents = enable ? 'auto' : 'none'; } } createMapEditorUI() { if (!APP_SETTINGS.controls.showMapEditorUI) return; const uiContainer = document.createElement('div'); uiContainer.id = 'mapEditorUI'; uiContainer.style.cssText = ` position: absolute; top: 5px; left: 5px; background-color: rgba(0, 0, 0, 0.7); color: white; padding: 10px; border-radius: 3px; font-family: Arial, sans-serif; pointer-events: auto; width: 180px; height: auto; min-height: 100px; font-size: 7px; `; uiContainer.innerHTML = `

Map Editor

Map Width: ${APP_SETTINGS.TILEMAP_CONFIG.width}

Map Height: ${APP_SETTINGS.TILEMAP_CONFIG.height}

Obstacle Count: ${APP_SETTINGS.TILEMAP_CONFIG.obstacleCount}

Tile Size: ${APP_SETTINGS.TILEMAP_CONFIG.tileSize}

Min Obstacle Height: ${APP_SETTINGS.TILEMAP_CONFIG.obstacleMinHeight}

Max Obstacle Height: ${APP_SETTINGS.TILEMAP_CONFIG.obstacleMaxHeight}

Ground Color:

Obstacle Foreground Color:

Obstacle Background Color:

`; uiDiv.appendChild(uiContainer); // Add event listeners const mapWidthSlider = document.getElementById('mapWidth'); const mapHeightSlider = document.getElementById('mapHeight'); const obstacleCountSlider = document.getElementById('obstacleCount'); const tileSizeSlider = document.getElementById('tileSize'); const obstacleMinHeightSlider = document.getElementById('obstacleMinHeight'); const obstacleMaxHeightSlider = document.getElementById('obstacleMaxHeight'); const groundColorInput = document.getElementById('groundColor'); const obstacleForegroundColorInput = document.getElementById('obstacleForegroundColor'); const obstacleBackgroundColorInput = document.getElementById('obstacleBackgroundColor'); const regenerateButton = document.getElementById('regenerateMap'); mapWidthSlider.addEventListener('input', (e) => { document.getElementById('mapWidthValue').textContent = e.target.value; APP_SETTINGS.TILEMAP_CONFIG.width = parseInt(e.target.value); }); mapHeightSlider.addEventListener('input', (e) => { document.getElementById('mapHeightValue').textContent = e.target.value; APP_SETTINGS.TILEMAP_CONFIG.height = parseInt(e.target.value); }); obstacleCountSlider.addEventListener('input', (e) => { document.getElementById('obstacleCountValue').textContent = e.target.value; APP_SETTINGS.TILEMAP_CONFIG.obstacleCount = parseInt(e.target.value); }); tileSizeSlider.addEventListener('input', (e) => { document.getElementById('tileSizeValue').textContent = parseFloat(e.target.value).toFixed(1); APP_SETTINGS.TILEMAP_CONFIG.tileSize = parseFloat(e.target.value); }); groundColorInput.addEventListener('input', (e) => { APP_SETTINGS.TILEMAP_CONFIG.groundColor = parseInt(e.target.value.slice(1), 16); this.updateGroundColor(); }); obstacleForegroundColorInput.addEventListener('input', (e) => { APP_SETTINGS.TILEMAP_CONFIG.obstacleForegroundColor = parseInt(e.target.value.slice(1), 16); this.updateObstacleColors(); }); obstacleBackgroundColorInput.addEventListener('input', (e) => { APP_SETTINGS.TILEMAP_CONFIG.obstacleBackgroundColor = parseInt(e.target.value.slice(1), 16); this.updateObstacleColors(); }); obstacleMinHeightSlider.addEventListener('input', (e) => { document.getElementById('obstacleMinHeightValue').textContent = parseFloat(e.target.value).toFixed(1); APP_SETTINGS.TILEMAP_CONFIG.obstacleMinHeight = parseFloat(e.target.value); }); obstacleMaxHeightSlider.addEventListener('input', (e) => { document.getElementById('obstacleMaxHeightValue').textContent = parseFloat(e.target.value).toFixed(1); APP_SETTINGS.TILEMAP_CONFIG.obstacleMaxHeight = parseFloat(e.target.value); }); regenerateButton.addEventListener('click', () => { GameWorld.regenerateMap(); }); } updateGroundColor() { const groundColor = new THREE.Color(APP_SETTINGS.TILEMAP_CONFIG.groundColor); Materials.getMaterial('tileMaterial').color.copy(groundColor); } updateObstacleColors() { if (GameWorld && GameWorld.tileMap) { GameWorld.tileMap.obstacles.forEach(obstacle => obstacle.updateColor()); } } } 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 { constructor() { this.currentWave = 0; this.enemiesSpawned = 0; this.enemiesRemaining = 0; this.timeSinceLastSpawn = 0; this.isSpawning = false; this.availableSpawnPositions = []; this.timeBetweenWaves = APP_SETTINGS.enemySpawner.timeBetweenWaves; this.waveTimer = 0; this.isWaitingBetweenWaves = false; this.allWavesCompleted = false; this.selectedSpawnPosition = null; } updateAvailableSpawnPositions() { this.availableSpawnPositions = []; const tileMap = GameWorld.tileMap; if (!tileMap) return; const config = APP_SETTINGS.TILEMAP_CONFIG; const offsetX = (tileMap.width * config.tileSize) / 2; const offsetZ = (tileMap.height * config.tileSize) / 2; const playerPosition = window.Player ? window.Player.getPosition() : new THREE.Vector3(); const minDistanceFromPlayer = APP_SETTINGS.enemySpawner.spawnSettings.minDistanceFromPlayer; for (let x = 0; x < tileMap.width; x++) { for (let z = 0; z < tileMap.height; z++) { const worldX = x * config.tileSize - offsetX + config.tileSize / 2; const worldZ = z * config.tileSize - offsetZ + config.tileSize / 2; const position = new THREE.Vector3(worldX, config.baseHeight + 2, worldZ); if (!tileMap.obstacles.some(obstacle => obstacle.mesh.position.x === position.x && obstacle.mesh.position.z === position.z) && position.distanceTo(playerPosition) >= minDistanceFromPlayer) { this.availableSpawnPositions.push(position); } } } } startWave() { if (this.allWavesCompleted) { return; } if (this.currentWave < APP_SETTINGS.enemySpawner.waves.length) { this.isSpawning = true; this.enemiesSpawned = 0; this.enemiesRemaining = APP_SETTINGS.enemySpawner.waves[this.currentWave].enemyCount; this.updateAvailableSpawnPositions(); } else { this.allWavesCompleted = true; console.log("All waves completed!"); } } update(deltaTime) { if (this.allWavesCompleted) { // All waves are completed, no need to update return; } if (this.isWaitingBetweenWaves) { this.waveTimer += deltaTime; if (this.waveTimer >= this.timeBetweenWaves) { this.isWaitingBetweenWaves = false; this.startWave(); } return; } if (!this.isSpawning) return; this.timeSinceLastSpawn += deltaTime; const currentWaveConfig = APP_SETTINGS.enemySpawner.waves[this.currentWave]; const allEnemiesSpawned = this.enemiesSpawned >= currentWaveConfig.enemyCount; if (this.timeSinceLastSpawn >= currentWaveConfig.spawnInterval && !allEnemiesSpawned) { if (!this.selectedSpawnPosition) { this.selectSpawnPosition(); } this.spawnEnemy(); this.timeSinceLastSpawn = 0; this.selectedSpawnPosition = null; } else if (!this.selectedSpawnPosition && !allEnemiesSpawned) { this.selectSpawnPosition(); } this.checkWaveCompletion(); // Update flashing tiles if (this.selectedSpawnPosition) { const tileX = Math.floor((this.selectedSpawnPosition.x + (GameWorld.tileMap.width * APP_SETTINGS.TILEMAP_CONFIG.tileSize) / 2) / APP_SETTINGS.TILEMAP_CONFIG.tileSize); const tileZ = Math.floor((this.selectedSpawnPosition.z + (GameWorld.tileMap.height * APP_SETTINGS.TILEMAP_CONFIG.tileSize) / 2) / APP_SETTINGS.TILEMAP_CONFIG.tileSize); const selectedTile = GameWorld.tileMap.getTileAt(tileX, tileZ); if (selectedTile) { selectedTile.flash(deltaTime); } } } spawnEnemy() { if (this.selectedSpawnPosition) { const spawnPosition = this.selectedSpawnPosition.clone(); spawnPosition.y = APP_SETTINGS.TILEMAP_CONFIG.baseHeight + 2; window.EnemyManager.createEnemy(spawnPosition); this.enemiesSpawned++; // Stop flashing and reset the tile state to normal after spawning const tileX = Math.floor((spawnPosition.x + (GameWorld.tileMap.width * APP_SETTINGS.TILEMAP_CONFIG.tileSize) / 2) / APP_SETTINGS.TILEMAP_CONFIG.tileSize); const tileZ = Math.floor((spawnPosition.z + (GameWorld.tileMap.height * APP_SETTINGS.TILEMAP_CONFIG.tileSize) / 2) / APP_SETTINGS.TILEMAP_CONFIG.tileSize); const selectedTile = GameWorld.tileMap.getTileAt(tileX, tileZ); if (selectedTile) { selectedTile.stopFlashing(); } this.selectedSpawnPosition = null; } else {} } selectSpawnPosition() { let spawnAttempts = 0; const maxSpawnAttempts = APP_SETTINGS.enemySpawner.spawnSettings.maxSpawnAttempts; while (spawnAttempts < maxSpawnAttempts) { if (this.availableSpawnPositions.length === 0) { this.updateAvailableSpawnPositions(); if (this.availableSpawnPositions.length === 0) { return; } } const randomIndex = Math.floor(Math.random() * this.availableSpawnPositions.length); const spawnPosition = this.availableSpawnPositions[randomIndex].clone(); if (this.isValidSpawnPosition(spawnPosition)) { this.selectedSpawnPosition = spawnPosition; this.availableSpawnPositions.splice(randomIndex, 1); const tileX = Math.floor((spawnPosition.x + (GameWorld.tileMap.width * APP_SETTINGS.TILEMAP_CONFIG.tileSize) / 2) / APP_SETTINGS.TILEMAP_CONFIG.tileSize); const tileZ = Math.floor((spawnPosition.z + (GameWorld.tileMap.height * APP_SETTINGS.TILEMAP_CONFIG.tileSize) / 2) / APP_SETTINGS.TILEMAP_CONFIG.tileSize); const selectedTile = GameWorld.tileMap.getTileAt(tileX, tileZ); if (selectedTile) { selectedTile.startFlashing(); } return; } spawnAttempts++; } } isValidSpawnPosition(position) { if (!window.Player) return true; const playerPosition = window.Player.getPosition(); const minDistance = APP_SETTINGS.enemySpawner.spawnSettings.minDistanceFromPlayer; return position.distanceTo(playerPosition) >= minDistance; } notifyEnemyDeath() { this.enemiesRemaining--; this.checkWaveCompletion(); } checkWaveCompletion() { const currentWaveConfig = APP_SETTINGS.enemySpawner.waves[this.currentWave]; if (this.enemiesSpawned >= currentWaveConfig.enemyCount && this.enemiesRemaining === 0) { this.completeWave(); } } completeWave() { console.log(`Wave ${this.currentWave + 1} completed!`); this.isSpawning = false; if (this.currentWave + 1 < APP_SETTINGS.enemySpawner.waves.length) { this.currentWave++; this.isWaitingBetweenWaves = true; this.waveTimer = 0; console.log(`Waiting ${this.timeBetweenWaves} seconds before starting next wave...`); } else { this.allWavesCompleted = true; console.log("All waves completed!"); } } } class Tile { constructor(x, z, mapWidth, mapHeight) { this.x = x; this.z = z; this.mapWidth = mapWidth; this.mapHeight = mapHeight; this.state = 'normal'; this.material = this.createMaterial(); this.mesh = this.createMesh(); this.body = this.createPhysicsBody(); } createMaterial() { const config = APP_SETTINGS.TILEMAP_CONFIG; return new THREE.MeshStandardMaterial({ color: new THREE.Color(config.groundColor), roughness: 0.8, metalness: 0.2 }); } createMesh() { const config = APP_SETTINGS.TILEMAP_CONFIG; const geometry = new THREE.PlaneGeometry(config.tileSize, config.tileSize); const mesh = new THREE.Mesh(geometry, this.material); const offsetX = (this.mapWidth * config.tileSize) / 2; const offsetZ = (this.mapHeight * 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 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); 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; } setState(state) { this.state = state; this.updateColor(); } updateColor() { const config = APP_SETTINGS.TILEMAP_CONFIG; switch (this.state) { case 'spawning': this.material.color.setHex(0xff0000); // Red color break; case 'normal': default: this.material.color.setHex(config.groundColor); break; } } startFlashing() { this.isFlashing = true; this.flashTimer = 0; this.flashState = true; } stopFlashing() { this.isFlashing = false; this.setState('normal'); } easeInOutSine(t) { return -(Math.cos(Math.PI * t) - 1) / 2; } flash(deltaTime) { if (!this.isFlashing) return; this.flashTimer += deltaTime; const cycleProgress = (this.flashTimer % APP_SETTINGS.enemySpawner.tileFlashInterval) / APP_SETTINGS.enemySpawner.tileFlashInterval; const easedProgress = this.easeInOutSine(cycleProgress); const groundColor = new THREE.Color(APP_SETTINGS.TILEMAP_CONFIG.groundColor); const flashColor = new THREE.Color(0xff0000); this.material.color.lerpColors(groundColor, flashColor, easedProgress); if (this.flashTimer >= APP_SETTINGS.enemySpawner.tileFlashInterval) { this.flashTimer %= APP_SETTINGS.enemySpawner.tileFlashInterval; } } } class TileMap { constructor(width, height) { this.width = width; this.height = height; this.tiles = []; this.mapMesh = new THREE.Group(); this.obstacles = []; this.createTiles(); this.navMesh = new NavMesh(this); } update(deltaTime) { this.tiles.forEach(tile => { if (tile.isFlashing) { tile.flash(deltaTime); } }); this.obstacles.forEach(obstacle => obstacle.update()); } createTiles() { for (let x = 0; x < this.width; x++) { for (let z = 0; z < this.height; z++) { const tile = new Tile(x, z, this.width, this.height); this.tiles.push(tile); this.mapMesh.add(tile.mesh); GameWorld.physicsWorld.addBody(tile.body); } } } getTileAt(x, z) { return this.tiles.find(tile => tile.x === x && tile.z === z); } render() { return this.mapMesh; } spawnObstacle(x, z) { const obstacle = new Obstacle(this, x, z); this.obstacles.push(obstacle); this.mapMesh.add(obstacle.mesh); return obstacle; } removeObstacle(obstacle) { const index = this.obstacles.indexOf(obstacle); if (index !== -1) { obstacle.remove(); this.obstacles.splice(index, 1); } } updateObstacles() { this.obstacles.forEach(obstacle => obstacle.update()); } } class TileMapGenerator { constructor() { this.updateDimensions(); } updateDimensions() { const config = APP_SETTINGS.TILEMAP_CONFIG; this.width = config.width; this.height = config.height; } generateMap() { let tilemap; let isAccessible = false; let attempts = 0; const maxAttempts = 20; // Limit the number of regeneration attempts while (!isAccessible && attempts < maxAttempts) { this.updateDimensions(); this.createTileMaterial(); tilemap = new TileMap(this.width, this.height); // Generate random obstacles using Fisher-Yates shuffle const obstacleCount = APP_SETTINGS.TILEMAP_CONFIG.obstacleCount; const availableTiles = this.getAvailableTiles(tilemap); const shuffledTiles = this.fisherYatesShuffle(availableTiles); for (let i = 0; i < obstacleCount && i < shuffledTiles.length; i++) { const [x, z] = shuffledTiles[i]; tilemap.spawnObstacle(x, z); } // Check map accessibility isAccessible = this.checkMapAccessibility(tilemap); attempts++; if (!isAccessible) { console.log(`Map not fully accessible. Regenerating... (Attempt ${attempts})`); // Clean up the current tilemap before regenerating tilemap.obstacles.forEach(obstacle => obstacle.remove()); tilemap.tiles.forEach(tile => GameWorld.physicsWorld.removeBody(tile.body)); } } if (isAccessible) { // Create NavMesh after generating the tilemap tilemap.navMesh = new NavMesh(tilemap); } else { console.warn(`Failed to generate a fully accessible map after ${maxAttempts} attempts.`); } return tilemap; } checkMapAccessibility(tilemap) { const grid = this.createGrid(tilemap); const startPosition = this.findStartPosition(grid); const visitedPositions = this.floodFill(grid, startPosition); const totalFreeSpaces = this.countFreeSpaces(grid); const isAccessible = visitedPositions === totalFreeSpaces; if (isAccessible) { console.log("Map is fully accessible."); } else { console.log(`Map is not fully accessible. Accessible tiles: ${visitedPositions}/${totalFreeSpaces}`); } return isAccessible; } createGrid(tilemap) { const grid = Array(this.height).fill().map(() => Array(this.width).fill(0)); tilemap.obstacles.forEach(obstacle => { const x = Math.floor((obstacle.mesh.position.x + (this.width * APP_SETTINGS.TILEMAP_CONFIG.tileSize) / 2) / APP_SETTINGS.TILEMAP_CONFIG.tileSize); const z = Math.floor((obstacle.mesh.position.z + (this.height * APP_SETTINGS.TILEMAP_CONFIG.tileSize) / 2) / APP_SETTINGS.TILEMAP_CONFIG.tileSize); grid[z][x] = 1; // Mark obstacle }); return grid; } findStartPosition(grid) { for (let z = 0; z < this.height; z++) { for (let x = 0; x < this.width; x++) { if (grid[z][x] === 0) return { x, z }; } } return null; // Should never happen if the map has at least one free space } floodFill(grid, start) { const stack = [start]; let visitedCount = 0; const visited = Array(this.height).fill().map(() => Array(this.width).fill(false)); while (stack.length > 0) { const { x, z } = stack.pop(); if (x < 0 || x >= this.width || z < 0 || z >= this.height || grid[z][x] === 1 || visited[z][x]) continue; visited[z][x] = true; visitedCount++; stack.push({ x: x + 1, z }, { x: x - 1, z }, { x, z: z + 1 }, { x, z: z - 1 }); } return visitedCount; } countFreeSpaces(grid) { return grid.flat().filter(cell => cell === 0).length; } fisherYatesShuffle(array) { const shuffled = array.slice(); for (let i = shuffled.length - 1; i > 0; i--) { const j = Math.floor(Math.random() * (i + 1)); [shuffled[i], shuffled[j]] = [shuffled[j], shuffled[i]]; } return shuffled; } getAvailableTiles(tilemap) { const availableTiles = []; for (let x = 0; x < this.width; x++) { for (let z = 0; z < this.height; z++) { // Check if the tile is not occupied by an obstacle if (!tilemap.obstacles.some(obstacle => obstacle.mesh.position.x === x && obstacle.mesh.position.z === z)) { availableTiles.push([x, z]); } } } return availableTiles; } // Remove createGridLines method as it's now part of the TileMap class createTileMaterial() { const materialParams = { color: new THREE.Color(APP_SETTINGS.TILEMAP_CONFIG.groundColor), roughness: .1, metalness: .3, // emissive: new THREE.Color(0x222222), // emissiveIntensity: 0.2 }; Materials.create('tileMaterial', 'standard', materialParams); } createGridLines() { const config = APP_SETTINGS.TILEMAP_CONFIG; const material = new THREE.LineBasicMaterial({ color: config.gridLineColor, linewidth: 2 // Set line width to 2 (2x the default) }); 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); return gridLines; } } class Obstacle { constructor(tileMap, x, z) { this.tileMap = tileMap; this.x = x; this.z = z; this.height = this.generateRandomHeight(); this.mesh = this.createMesh(); this.body = this.createBody(); this.setPosition(x, z); this.updateColor(); } generateRandomHeight() { const config = APP_SETTINGS.TILEMAP_CONFIG; return Math.random() * (config.obstacleMaxHeight - config.obstacleMinHeight) + config.obstacleMinHeight; } createMesh() { const config = APP_SETTINGS.TILEMAP_CONFIG; const geometry = new THREE.BoxGeometry(config.tileSize, this.height, config.tileSize); const material = new THREE.MeshPhongMaterial(); const mesh = new THREE.Mesh(geometry, material); mesh.castShadow = true; mesh.receiveShadow = true; return mesh; } update() { // Sync mesh with physics body if needed this.mesh.position.copy(this.body.position); this.mesh.quaternion.copy(this.body.quaternion); this.updateColor(); } updateColor() { const config = APP_SETTINGS.TILEMAP_CONFIG; const gradientFactor = this.z / (this.tileMap.height - 1); const foregroundColor = new THREE.Color(config.obstacleForegroundColor); const backgroundColor = new THREE.Color(config.obstacleBackgroundColor); const blendedColor = foregroundColor.lerp(backgroundColor, gradientFactor); this.mesh.material.color.set(blendedColor); } createBody() { const config = APP_SETTINGS.TILEMAP_CONFIG; const shape = new CANNON.Box(new CANNON.Vec3(config.tileSize / 2, this.height / 2, config.tileSize / 2)); const body = new CANNON.Body({ mass: 0, // Static body shape: shape, material: new CANNON.Material('obstacle'), 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.bullet }); GameWorld.physicsWorld.addBody(body); return body; } setPosition(x, z) { const config = APP_SETTINGS.TILEMAP_CONFIG; const offsetX = (this.tileMap.width * config.tileSize) / 2; const offsetZ = (this.tileMap.height * config.tileSize) / 2; const posX = x * config.tileSize - offsetX + config.tileSize / 2; const posZ = z * config.tileSize - offsetZ + config.tileSize / 2; const posY = config.baseHeight + this.height / 2; this.mesh.position.set(posX, posY, posZ); this.body.position.set(posX, posY, posZ); this.x = x; this.z = z; this.updateColor(); GameWorld.physicsWorld.dirty = true; } update() { // Sync mesh with physics body if needed this.mesh.position.copy(this.body.position); this.mesh.quaternion.copy(this.body.quaternion); } remove() { // Remove from scene and physics world this.tileMap.mapMesh.remove(this.mesh); GameWorld.physicsWorld.removeBody(this.body); } } class TileMapManager { constructor() { this.maps = []; this.currentMapIndex = -1; } addMap(tileMap) { this.maps.push(tileMap); if (this.currentMapIndex === -1) { this.currentMapIndex = 0; } } getCurrentMap() { return this.maps[this.currentMapIndex]; } switchToMap(index) { if (index >= 0 && index < this.maps.length) { this.currentMapIndex = index; return this.getCurrentMap(); } return null; } removeMap(index) { if (index >= 0 && index < this.maps.length) { this.maps.splice(index, 1); if (this.currentMapIndex >= this.maps.length) { this.currentMapIndex = this.maps.length - 1; } } } getMapCount() { return this.maps.length; } createTileMap() { const mapGenerator = new TileMapGenerator(); const tileMap = mapGenerator.generateMap(); this.addMap(tileMap); WorldScene.add(tileMap.render()); const gridLines = mapGenerator.createGridLines(tileMap); WorldScene.add(gridLines); return { tileMap, gridLines }; } destroyMap() { const currentMap = this.getCurrentMap(); if (currentMap) { WorldScene.remove(currentMap.render()); currentMap.tiles.forEach(tile => { GameWorld.physicsWorld.removeBody(tile.body); }); currentMap.obstacles.forEach(obstacle => { GameWorld.physicsWorld.removeBody(obstacle.body); }); currentMap.obstacles = []; if (currentMap.navMesh) { currentMap.navMesh.removeVisualization(); } this.removeMap(this.currentMapIndex); } } regenerateMap() { this.destroyMap(); this.createTileMap(); } } window.Game = new App(); Game.start();