// 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 { FBXLoader } from 'three/addons/loaders/FBXLoader.js'; import { OBJLoader } from 'three/addons/loaders/OBJLoader.js'; import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js'; import { BasicSkyShader, MaterialManager, LightingManager, MeshManager } from 'https://play.rosebud.ai/assets/ThreeJSScripts.js?hZgy'; const SCRIPT_ASSETS = [{ name: "script_tilemapGen", url: "https://play.rosebud.ai/assets/script_tilemapGen.js?MxBz", }, { name: "script_tilemap", url: "https://play.rosebud.ai/assets/script_tilemap.js?bVpQ", }, { name: "script_obstacle", url: "https://play.rosebud.ai/assets/script_obstacle.js?mlER", }, { name: "script_tile", url: "https://play.rosebud.ai/assets/script_tile.js?kTNK", }, { name: "script_wall", url: "https://play.rosebud.ai/assets/script_wall.js?Ee3J", }, { name: "script_crosshair", url: "https://play.rosebud.ai/assets/script_crosshair.js?2xtq" }, { name: "script_ammodisplay", url: "https://play.rosebud.ai/assets/script_ammodisplay.js?YY03" }, { name: "script_cameraController", url: "https://play.rosebud.ai/assets/script_cameraController.js?Smaz" }, { name: "script_audioPlayer", url: "https://play.rosebud.ai/assets/script_audioPlayer.js?6FCn" }, { name: "script_ray", url: "https://play.rosebud.ai/assets/script_ray.js?nE1Z" }, { name: "script_astar", url: "https://play.rosebud.ai/assets/script_astar.js?vyaq" }, { name: "script_navmesh", url: "https://play.rosebud.ai/assets/script_navmesh.js?BJOC" }]; const MODEL_ASSETS = { PISTOL: { url: 'https://play.rosebud.ai/assets/semi_auto_pistol_g-17.glb?cJ4S', type: 'glb', scale: 2.5 }, CHARACTER: { url: 'https://play.rosebud.ai/assets/mc_character_model.obj?1v5W', type: 'obj', scale: 1 }, XBOT: { url: 'https://play.rosebud.ai/assets/mdl_xbot.fbx?y7Qq', type: 'fbx', scale: 0.10 }, SLENDERMAN: { url: 'https://play.rosebud.ai/assets/mdl_slenderman.glb?CQq8', type: 'glb', scale: 15 } }; const SOUND_ASSETS = { effects: { bulletHit: { url: 'https://play.rosebud.ai/assets/snd_bullet_hit.wav?5GSg', volume: 0.6 }, gunShot: { url: 'https://play.rosebud.ai/assets/snd_pistol_shot.wav?V6gU', volume: 0.075 }, reload: { url: 'https://play.rosebud.ai/assets/snd_reload.wav?qYEe', volume: 0.75 } }, music: { // Reserved for background music }, ambient: { // Reserved for ambient sounds } }; const APP_SETTINGS = { debug: { showEnemyStateLabel: false }, tilemap: { width: 10, height: 15, tileSize: 20, obstacles: [ // Middle barrier center map { x: 4, z: 7, }, { x: 5, z: 7, }, // Extends from east wall { x: 9, z: 5 }, { x: 8, z: 5 }, { x: 7, z: 5 }, // Extends west wall { x: 2, z: 5 }, { x: 1, z: 5 }, { x: 0, z: 5 }, // Extends from east wall { x: 9, z: 9 }, { x: 8, z: 9 }, { x: 7, z: 9 }, // Extends west wall { x: 2, z: 9 }, { x: 1, z: 9 }, { x: 0, z: 9 }, ] }, obstacles: { height: 50, physics: { mass: 0, // Static obstacles friction: 0.5, restitution: 0.3 }, material: { color: 0x808080, roughness: 0.7, metalness: 0.2 } }, controls: { hideGunSettingsMenu: true, createEnemyOnStart: true, enableMuzzleFlash: false, showNavMesh: false, showEnemyPath: false, enableEnemyAttacking: false, enableSunMovement: false, enableGunRecoil: false, enableGunReload: false, mouseSensitivity: { x: 0.005, y: 0.005 }, playerMoveSpeed: 30 }, renderer: { shadowMap: { enabled: true, type: THREE.PCFSoftShadowMap }, colorSpace: { output: THREE.SRGBColorSpace, toneMapping: THREE.ACESFilmicToneMapping, toneMappingExposure: 1.2 }, antialias: true, pixelRatio: window.devicePixelRatio }, world: { defaults: { skyColor: 0x87CEEB, groundColor: 0xFFFFFF }, }, enemyStates: { CHASING: 'CHASING', WAITING: 'WAITING', ATTACKING: 'ATTACKING' }, physics: { gravity: { x: 0, y: -9.81, z: 0 }, defaultContactMaterial: { friction: 0.01, restitution: 0.6 }, solver: { iterations: 10, tolerance: 0.001 }, collisionGroups: { PLAYER: 1, // 0001 in binary OBSTACLE: 2, // 0010 in binary GROUND: 4, // 0100 in binary ENEMY: 8 // 1000 in binary } }, enemy: { dimensions: { width: 1, height: 1, depth: 1 }, position: { x: 0, // was 50 y: 2, z: 70 // was 0 }, chaseSpeed: 15, waitDuration: 2000, startWaitingDistance: 35, attackDuration: 1000, attackCooldown: 2000, model: MODEL_ASSETS.XBOT }, camera: { fov: 75, near: 0.1, far: 1000, initialPosition: { x: 0, y: 50, z: 100 } }, player: { moveSpeed: 30, sensitivity: { x: 0.002, y: 0.002 }, initialPosition: { x: 0, y: 15, z: 120 // Moved south (positive Z) } }, gameplay: {}, guns: { pistol: { name: "Pistol", ammo: { current: 6, max: 6 }, fireRate: { isAutomatic: false, cooldown: 250 }, model: { ...MODEL_ASSETS.PISTOL, scaleByHolder: { player: MODEL_ASSETS.PISTOL.scale, enemy: MODEL_ASSETS.PISTOL.scale * 12.0 } }, texture: { url: 'https://play.rosebud.ai/assets/BLK64.png?B9l1' }, sound: { ...SOUND_ASSETS.effects.gunShot }, mounts: { player: { position: { x: 0.21, y: -0.35, z: -0.48 }, rotation: { x: 0, y: Math.PI - Math.PI / 2, z: 0 } }, enemy: { position: { x: -0.5, y: 13.6, z: 3.75 }, rotation: { x: 0, y: Math.PI + Math.PI / 2, z: 0 } } }, muzzleFlash: { size: 0.05, color: 0xffff00, duration: 20 }, }, }, lights: { sunlight: { color: 0xffffff, intensity: 2.5, position: { x: -50, y: 50, z: -50 }, 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 } }; // 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 ModelLoader { constructor() { this.loaders = { texture: new THREE.TextureLoader(LoadingManager), gltf: new GLTFLoader(LoadingManager), glb: new GLTFLoader(LoadingManager), fbx: new FBXLoader(LoadingManager), obj: new OBJLoader(LoadingManager), audio: new THREE.AudioLoader(LoadingManager) }; this.cache = { models: new Map(), textures: new Map(), audio: new Map() }; } async loadModel(modelData) { const { url, type, scale = 1, volume } = modelData; const cacheKey = `${url}_${scale}`; // Check cache first if (this.cache.models.has(cacheKey)) { return this.cache.models.get(cacheKey).clone(); } return new Promise((resolve, reject) => { const modelType = type.toLowerCase(); const loader = this.loaders[modelType]; if (!loader) { reject(new Error(`Unsupported model type: ${type}`)); return; } loader.load( url, (result) => { let model; // Handle different model types switch (modelType) { case 'gltf': case 'glb': model = result.scene; break; case 'fbx': case 'obj': model = result; break; default: model = result.scene || result; } if (!model) { reject(new Error(`Failed to load model: ${url}`)); return; } model.scale.setScalar(scale); this.cache.models.set(cacheKey, model.clone()); resolve(model); }, (progress) => { const percentage = (progress.loaded / progress.total * 100).toFixed(2); console.log(`Loading ${type}: ${percentage}%`); }, reject ); }); } async loadTexture(url) { if (this.cache.textures.has(url)) { return this.cache.textures.get(url).clone(); } return new Promise((resolve, reject) => { this.loaders.texture.load( url, (texture) => { this.cache.textures.set(url, texture); resolve(texture); }, undefined, reject ); }); } async loadAudio(url) { if (this.cache.audio.has(url)) { return this.cache.audio.get(url); } return new Promise((resolve, reject) => { this.loaders.audio.load( url, (buffer) => { const audio = new THREE.Audio(new THREE.AudioListener()); audio.setBuffer(buffer); this.cache.audio.set(url, audio); resolve(audio); }, undefined, reject ); }); } } class GunMount { constructor(mountPoint, defaultPosition, defaultRotation) { this.mountPoint = mountPoint; this.defaultPosition = new THREE.Vector3().copy(defaultPosition); this.defaultRotation = new THREE.Vector3().copy(defaultRotation); this.currentPosition = new THREE.Vector3().copy(defaultPosition); this.currentRotation = new THREE.Vector3().copy(defaultRotation); this.offsetPosition = new THREE.Vector3(); this.offsetRotation = new THREE.Vector3(); // Add world position tracking this.currentWorldPosition = new THREE.Vector3(); this.currentWorldRotation = new THREE.Vector3(); this.previousWorldPosition = new THREE.Vector3(); this.previousWorldRotation = new THREE.Vector3(); } update(deltaTime) { if (!this.mountPoint) return; // Get current world position and rotation const worldPosition = this.getWorldPosition(); const worldRotation = this.getWorldRotation(); // Store current transform for next frame this.currentWorldPosition = worldPosition; this.currentWorldRotation = worldRotation; } setPosition(position) { this.currentPosition.copy(position); } setRotation(rotation) { this.currentRotation.copy(rotation); } addPositionOffset(offset) { this.offsetPosition.add(offset); } addRotationOffset(offset) { this.offsetRotation.add(offset); } resetOffsets() { console.log('GunMount: Resetting offsets'); console.log('Previous position offset:', this.offsetPosition.clone()); console.log('Previous rotation offset:', this.offsetRotation.clone()); this.offsetPosition.set(0, 0, 0); this.offsetRotation.set(0, 0, 0); console.log('Reset position offset:', this.offsetPosition.clone()); console.log('Reset rotation offset:', this.offsetRotation.clone()); } // Gets final world position considering mount point and all offsets getWorldPosition() { // Create vectors for position calculation const mountWorldPosition = new THREE.Vector3(); const mountWorldQuaternion = new THREE.Quaternion(); const finalPosition = new THREE.Vector3(); // Get mount point's world position and rotation this.mountPoint.getWorldPosition(mountWorldPosition); this.mountPoint.getWorldQuaternion(mountWorldQuaternion); // Start with current position finalPosition.copy(this.currentPosition); // Add any offset if (this.offsetPosition.lengthSq() > 0) { finalPosition.add(this.offsetPosition); } // Transform position by mount point's world quaternion finalPosition.applyQuaternion(mountWorldQuaternion); // Add mount point's world position finalPosition.add(mountWorldPosition); return finalPosition; } // Gets final rotation considering mount point and all offsets getWorldRotation() { const finalRotation = new THREE.Vector3() .copy(this.currentRotation) .add(this.offsetRotation); return finalRotation; } reset() { this.currentPosition.copy(this.defaultPosition); this.currentRotation.copy(this.defaultRotation); this.resetOffsets(); } } class Gun { static nextId = 1; constructor(scene, camera, model, texture, sound, settings) { this.id = Gun.nextId++; this.scene = scene; this.camera = camera; this.model = model; this.mount = null; // Will be set by GunController this.currentPosition = new THREE.Vector3(); this.currentRotation = new THREE.Vector3(); this.texture = texture; this.shootSound = sound; this.wasMouseDown = false; // Gun states this.states = { IDLE: 'IDLE', SHOOTING: 'SHOOTING', RELOADING: 'RELOADING', }; this.currentState = this.states.IDLE; // Reload animation properties this.reloadAnimation = { active: false, progress: 0, duration: 1.0, // Duration in seconds startPosition: new THREE.Vector3(), startRotation: new THREE.Vector3(), midPosition: new THREE.Vector3(0, -0.6, -0.3), // Down and center position midRotation: new THREE.Vector3(-Math.PI / 4, Math.PI - Math.PI / 2, 0) // Tilted down rotation }; // Recoil properties this.recoil = { active: false, progress: 0, duration: 0.15, // Duration in seconds maxPositionOffset: new THREE.Vector3(0, 0, 0.075), maxRotationOffset: new THREE.Vector3(0.15, 0, 0), cooldown: 0.15 // Match cooldown with recoil duration }; this.currentAmmo = settings.ammo.current; this.maxAmmo = settings.ammo.max; this.isReloading = false; this.reloadTime = 1000; // 1 second reload time this.reloadStartTime = 0; // Store gun position and rotation this.currentPosition = settings.position; this.currentRotation = settings.rotation; if (this.shootSound && settings.sound && typeof settings.sound.volume === 'number') { this.shootSound.setVolume(settings.sound.volume); } this.settings = settings; this.muzzleFlash = null; this.lastShotTime = 0; this.isAutomatic = settings.fireRate.isAutomatic; this.cooldown = settings.fireRate.cooldown; this.ray = new Ray({ THREE: THREE, origin: new THREE.Vector3(), direction: new THREE.Vector3() }); this.setupModel(); } setupModel() { if (this.model && this.texture) { // Do not set scale here - it will be set when assigned to a holder this.model.traverse((child) => { if (child.isMesh) { child.material.map = this.texture; child.material.needsUpdate = true; } }); this.scene.add(this.model); } } updatePosition(deltaTime) { if (!this.model || !this.mount) return; // Get the mount's world position and rotation const mountWorldPosition = this.mount.getWorldPosition(); const mountWorldRotation = this.mount.getWorldRotation(); // Update model position and rotation this.model.position.copy(mountWorldPosition); // Update muzzle flash if it exists if (this.muzzleFlash) { this.muzzleFlash.update(this.model.position, this.model.quaternion); } this.updateModelTransform(); } updateRecoilAnimation(deltaTime) { if (!this.recoil.active) return; if (!APP_SETTINGS.controls.enableGunRecoil) { this.recoil.active = false; this.recoil.progress = 0; this.mount.resetOffsets(); return; } // Progress the recoil animation this.recoil.progress += deltaTime / this.recoil.duration; if (this.recoil.progress >= 1) { // Reset recoil console.log('Setting recoil active to false - recoil animation complete'); this.recoil.active = false; this.recoil.progress = 0; this.mount.resetOffsets(); return; } // Calculate recoil animation curve (out-and-back) const curve = Math.sin(this.recoil.progress * Math.PI); // Directly set mount offsets based on curve this.mount.offsetPosition.copy(this.recoil.maxPositionOffset).multiplyScalar(curve); this.mount.offsetRotation.copy(this.recoil.maxRotationOffset).multiplyScalar(curve); } updateReloadAnimation(deltaTime) { if (!APP_SETTINGS.controls.enableGunReload || !this.reloadAnimation.active) { this.reloadAnimation.active = false; this.reloadAnimation.progress = 0; return; } // Progress the reload animation this.reloadAnimation.progress += deltaTime / this.reloadAnimation.duration; if (this.reloadAnimation.progress >= 1) { // Reset animation this.reloadAnimation.active = false; this.reloadAnimation.progress = 0; return; } // Calculate animation curves for down and up movement let curve; if (this.reloadAnimation.progress < 0.5) { // Going to mid position (down and center) in first half curve = this.easeInOutQuad(this.reloadAnimation.progress * 2); // 0 to 1 in first half this.currentPosition = new THREE.Vector3().lerpVectors( new THREE.Vector3().copy(this.reloadAnimation.startPosition), this.reloadAnimation.midPosition, curve ); this.currentRotation = new THREE.Vector3().lerpVectors( new THREE.Vector3().copy(this.reloadAnimation.startRotation), this.reloadAnimation.midRotation, curve ); } else { // Returning to original position in second half curve = this.easeInOutQuad((this.reloadAnimation.progress - 0.5) * 2); // 0 to 1 in second half this.currentPosition = new THREE.Vector3().lerpVectors( this.reloadAnimation.midPosition, this.reloadAnimation.startPosition, curve ); this.currentRotation = new THREE.Vector3().lerpVectors( this.reloadAnimation.midRotation, this.reloadAnimation.startRotation, curve ); } } easeInOutQuad(t) { return t < 0.5 ? 2 * t * t : 1 - Math.pow(-2 * t + 2, 2) / 2; } updateModelTransform() { if (!this.model || !this.mount) return; // Get final world position and rotation from holder's mount const worldPosition = this.mount.getWorldPosition(); const worldRotation = this.mount.getWorldRotation(); // Apply position to model this.model.position.copy(worldPosition); // Create quaternion from euler rotation const targetQuaternion = new THREE.Quaternion(); targetQuaternion.setFromEuler(new THREE.Euler( worldRotation.x, worldRotation.y, worldRotation.z, 'XYZ' )); // Only apply camera quaternion for player-held guns if (this.mount.mountPoint === MainCamera) { targetQuaternion.premultiply(this.camera.quaternion); } // Apply final rotation to model this.model.quaternion.copy(targetQuaternion); } playShootSound() { if (this.shootSound) { if (this.shootSound.isPlaying) { this.shootSound.stop(); } this.shootSound.play(); } } performRaycast() { const direction = new THREE.Vector3(); this.camera.getWorldDirection(direction); this.ray.update(this.camera.position.clone(), direction.normalize()); let closestIntersection = null; let minDistance = Infinity; // Check obstacles if (GameWorld.tilemap) { const obstacles = GameWorld.tilemap.getObstacles(); obstacles.forEach(obstacle => { if (obstacle.mesh) { const intersection = this.ray.checkIntersection(obstacle.mesh); if (intersection && intersection.distance < minDistance) { minDistance = intersection.distance; closestIntersection = { ...intersection, type: 'obstacle' }; } } }); // Check walls const walls = GameWorld.tilemap.getWalls(); walls.forEach(wall => { if (wall.mesh) { const intersection = this.ray.checkIntersection(wall.mesh); if (intersection && intersection.distance < minDistance) { minDistance = intersection.distance; closestIntersection = { ...intersection, type: 'wall' }; } } }); } // Check enemy only if no closer obstacles/walls were hit if (window.Enemy && window.Enemy.model) { const enemyIntersection = this.ray.checkIntersection(window.Enemy.model); if (enemyIntersection && enemyIntersection.distance < minDistance) { closestIntersection = { ...enemyIntersection, type: 'enemy' }; window.AudioPlayer.play('bulletHit'); } } return closestIntersection; } update(deltaTime) { if (!this.checkInputSystem()) { return; } const currentTime = Date.now(); const isMouseDown = window.Input.isMouseDown; // Execute current state action only this.executeStateAction(this.currentState, deltaTime, currentTime, isMouseDown); this.wasMouseDown = isMouseDown; } executeStateAction(state, deltaTime, currentTime, isMouseDown) { switch (state) { case this.states.IDLE: // Handle idle animations or effects this.updatePositionAndAnimations(deltaTime); break; case this.states.SHOOTING: // Only handle animations, shooting is done in enterState this.updatePositionAndAnimations(deltaTime); break; case this.states.RELOADING: this.updatePositionAndAnimations(deltaTime); break; } } enterState(state) { console.log(`Gun: Entering state ${state}`); switch (state) { case this.states.IDLE: // Reset any firing states console.log('Setting recoil active to false on IDLE state enter'); this.recoil.active = false; break; case this.states.SHOOTING: // Initialize recoil animation and perform the shot console.log('Setting recoil active to true on SHOOTING state enter'); this.recoil.active = true; this.recoil.progress = 0; this.mount.offsetPosition.copy(this.recoil.maxPositionOffset); this.mount.offsetRotation.copy(this.recoil.maxRotationOffset); this.shoot(); // Call shoot only when entering SHOOTING state break; case this.states.RELOADING: this.startReload(); break; } } exitState(state) { console.log(`Gun: Exiting state ${state}`); switch (state) { case this.states.IDLE: break; case this.states.SHOOTING: break; case this.states.RELOADING: // Complete reload when exiting reload state this.currentAmmo = this.maxAmmo; if (window.AmmoDisplay) { window.AmmoDisplay.updateAmmo(this.currentAmmo, this.maxAmmo); } // Ensure reload animation is complete this.reloadAnimation.active = false; this.reloadAnimation.progress = 0; break; } } isShooting() { return this.currentState === this.states.SHOOTING; } canShoot(currentTime, isMouseDown) { if (this.currentState === this.states.RELOADING) { return false; } if (this.currentAmmo <= 0) { return false; } const cooldownPassed = currentTime - this.lastShotTime >= this.cooldown; if (!cooldownPassed) { return false; } if (this.isAutomatic) { return isMouseDown; } return isMouseDown && !this.wasMouseDown; } canReload() { return this.currentAmmo < this.maxAmmo && this.currentState !== this.states.RELOADING; } isInState(state) { return this.currentState === state; } updatePositionAndAnimations(deltaTime) { this.updateRecoilAnimation(deltaTime); this.updateReloadAnimation(deltaTime); this.updatePosition(deltaTime); } checkInputSystem() { if (!window.Input) { console.log('Gun update: Input system not available'); return false; } return true; } isShootingComplete() { const currentTime = Date.now(); return currentTime - this.lastShotTime >= this.cooldown; } shoot() { if (this.currentAmmo <= 0) { return; } this.playShootSound(); const hitInfo = this.performRaycast(); if (hitInfo && hitInfo.type === 'enemy') { window.AudioPlayer.play('bulletHit'); } if (this.muzzleFlash) { this.muzzleFlash.show(); } this.lastShotTime = Date.now(); this.currentAmmo--; // Update ammo display if (window.AmmoDisplay) { window.AmmoDisplay.updateAmmo(this.currentAmmo, this.maxAmmo); } } getCurrentAmmo() { return this.currentAmmo; } isReloadComplete() { if (this.currentState !== this.states.RELOADING) return false; return Date.now() - this.reloadStartTime >= this.reloadTime; } getMaxAmmo() { return this.maxAmmo; } startReload() { this.reloadStartTime = Date.now(); // Initialize reload animation this.reloadAnimation.active = true; this.reloadAnimation.progress = 0; // Store current position and rotation as start values, with proper initialization this.reloadAnimation.startPosition = new THREE.Vector3(); if (this.currentPosition) { this.reloadAnimation.startPosition.copy(this.currentPosition); } this.reloadAnimation.startRotation = new THREE.Vector3(); if (this.currentRotation) { this.reloadAnimation.startRotation.copy(this.currentRotation); } // Play reload sound if (window.AudioPlayer) { window.AudioPlayer.play('reload'); } // Update ammo display to show reloading if (window.AmmoDisplay) { window.AmmoDisplay.updateAmmo('...', this.maxAmmo); } } reload() { if (this.canReload()) { // Change state to reloading instead of directly starting reload this.currentState = this.states.RELOADING; this.enterState(this.states.RELOADING); } } hide() { if (this.model) { this.model.visible = false; } } show() { if (this.model) { this.model.visible = true; } } } class GunManager { constructor(scene, camera) { this.scene = scene; this.camera = camera; this.holders = new Map(); // Map of holder name to { holder, currentGun } this.loadedGuns = new Map(); this.isInitialized = false; this.loadingState = { inProgress: false, currentGunType: null, error: null }; } async initialize() { if (this.isInitialized) { console.warn('GunManager already initialized'); return; } try { // Validate gun settings if (!APP_SETTINGS.guns || Object.keys(APP_SETTINGS.guns).length === 0) { throw new Error('No gun settings found in APP_SETTINGS'); } this.isInitialized = true; console.log('GunManager initialized successfully'); } catch (error) { console.error('Failed to initialize GunManager:', error); throw error; } } validateGunType(gunType) { if (!APP_SETTINGS.guns?.[gunType]) { throw new Error(`Invalid gun type: ${gunType}`); } } async loadGun(gunType) { try { this.validateGunType(gunType); if (this.loadedGuns.has(gunType)) { console.log(`Gun ${gunType} already loaded, returning cached instance`); return this.loadedGuns.get(gunType); } this.loadingState = { inProgress: true, currentGunType: gunType, error: null }; const gunSettings = APP_SETTINGS.guns[gunType]; console.log(`Loading gun assets for ${gunType}...`); const [model, texture, sound] = await Promise.all([ window.ModelLoader.loadModel(gunSettings.model), window.ModelLoader.loadTexture(gunSettings.texture.url), window.ModelLoader.loadAudio(gunSettings.sound.url, gunSettings.sound.volume) ]); const gun = new Gun(this.scene, this.camera, model, texture, sound, gunSettings); console.log(`Created new gun instance with ID: ${gun.id} for type: ${gunType}`); this.loadedGuns.set(gunType, gun); console.log(`Gun ${gunType} loaded successfully`); return gun; } catch (error) { this.loadingState.error = error; console.error(`Failed to load gun ${gunType}:`, error); throw error; } finally { this.loadingState.inProgress = false; } } assignHolder(holderName, holder) { if (!this.holders.has(holderName)) { this.holders.set(holderName, { holder, currentGun: null }); console.log(`Holder ${holderName} assigned successfully`); } } async assignGunToHolder(holderName, gunType) { console.log(`[GunManager] Starting gun assignment for holder: ${holderName}, type: ${gunType}`); // Get the gun settings const gunSettings = APP_SETTINGS.guns[gunType]; if (!gunSettings?.model?.scaleByHolder?.[holderName]) { console.warn(`No scale setting found for holder ${holderName}, using default scale`); } if (!this.isInitialized) { console.error('[GunManager] Attempted to assign gun before initialization'); throw new Error('GunManager not initialized'); } const holderData = this.holders.get(holderName); if (!holderData) { console.error(`[GunManager] Holder ${holderName} not found in holders map`); console.log('[GunManager] Current holders:', Array.from(this.holders.keys())); throw new Error(`Holder ${holderName} not found`); } try { console.log(`[GunManager] Current holder data:`, { holderName, hasGunController: !!holderData.holder.gunController, hasMount: !!holderData.holder.gunMount }); // Hide current gun if exists if (holderData.currentGun) { console.log(`[GunManager] Hiding current gun for ${holderName}`); holderData.currentGun.hide(); } // Load the gun if not already loaded console.log(`[GunManager] Loading gun of type: ${gunType}`); const gun = await this.loadGun(gunType); console.log(`[GunManager] Gun loaded successfully:`, { gunId: gun.id, hasModel: !!gun.model, hasMount: !!gun.mount }); // Assign the gun to the holder holderData.currentGun = gun; // Apply holder-specific scale const scale = gunSettings.model.scaleByHolder[holderName] || gunSettings.model.scale; gun.model.scale.setScalar(scale); // Setup gun controller and mount if (holderData.holder.gunController) { console.log(`[GunManager] Assigning mount to gun for ${holderName}:`, { gunId: gun.id, hasGunController: true, controllerMount: !!holderData.holder.gunController.mount }); holderData.holder.gunController.assignMount(gun); console.log(`[GunManager] Mount assigned to gun:`, { gunId: gun.id, hasMount: !!gun.mount, mountPosition: gun.mount ? gun.mount.currentPosition : null }); } else { console.warn(`[GunManager] No gun controller found for holder: ${holderName}`); } // Update ammo display if (window.AmmoDisplay) { window.AmmoDisplay.updateAmmo(gun.getCurrentAmmo(), gun.getMaxAmmo()); } // Show the gun gun.show(); console.log(`Gun ${gunType} assigned to holder ${holderName} successfully`); return gun; } catch (error) { console.error(`Failed to assign gun ${gunType} to holder ${holderName}:`, error); throw error; } } getGunForHolder(holderName) { const holderData = this.holders.get(holderName); if (!holderData) { console.warn(`No holder found with name: ${holderName}`); return null; } return holderData.currentGun; } update(deltaTime) { // Update all holders' guns for (const [holderName, holderData] of this.holders) { if (holderData.currentGun) { holderData.currentGun.update(deltaTime); } } } } 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 basic sky 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) { if (this.skyMesh) { this.skyMesh.position.set(0, 0, 0); } } 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.getSkyColor() : new THREE.Color(0x87CEEB); } getGroundColor() { return this.shaderMaterial ? this.shaderMaterial.getGroundColor() : new THREE.Color(0xFFFFFF); } setSkyColor(color) { if (this.shaderMaterial) { this.shaderMaterial.setSkyColor(new THREE.Color(color)); } } setGroundColor(color) { if (this.shaderMaterial) { this.shaderMaterial.setGroundColor(new THREE.Color(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.tilemap = null; this.Time = new WorldTime(); } 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) => { if (APP_SETTINGS.controls.enableSunMovement) { 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 ); MainCamera.position.set( APP_SETTINGS.camera.initialPosition.x, APP_SETTINGS.camera.initialPosition.y, APP_SETTINGS.camera.initialPosition.z ); MainCamera.lookAt(0, 0, 0); console.log('Camera initialized with APP_SETTINGS parameters'); } initRenderer() { window.GameRenderer = new Renderer(MainCamera); GameRenderer.initPostProcessing(WorldScene); } createTilemap() { if (this.tilemap) { return this.tilemap; } try { const tileMapGenerator = new TileMapGenerator({ THREE: THREE, CANNON: CANNON, Materials: window.Materials, settings: APP_SETTINGS, scene: window.WorldScene, physicsWorld: this.physicsWorld, Tile: Tile, Wall: Wall, Obstacle: Obstacle, NavMesh: NavMesh }); this.tilemap = tileMapGenerator.generateMap(); if (!this.tilemap) { throw new Error('TileMapGenerator failed to generate map'); } return this.tilemap; } catch (error) { console.error('Failed to create tilemap:', error); throw error; } } 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); GameRenderer.render(); } } class InputHandler { constructor() { this.mouseHandler = this.handleMouseMove.bind(this); this.mouseDownHandler = this.handleMouseDown.bind(this); this.isMouseDown = false; this.lastDebugTime = 0; this.debugInterval = 1000; // Log every 1 second // Mouse movement tracking this.mouseDelta = { x: 0, y: 0 }; this.previousMousePosition = { x: 0, y: 0 }; this.currentMousePosition = { x: 0, y: 0 }; this.mouseMoveAmount = { x: 0, y: 0 }; // For debugging this.initControls(); } initControls() { document.addEventListener('mousemove', this.mouseHandler); document.addEventListener('click', () => { canvas.requestPointerLock(); }); document.addEventListener('mousedown', this.mouseDownHandler); document.addEventListener('mouseup', (event) => this.handleMouseUp(event)); this.initialized = true; } isInitialized() { return this.initialized === true; } handleMouseDown(event) { if (document.pointerLockElement === canvas) { this.isMouseDown = true; this.previousMousePosition.x = event.clientX; this.previousMousePosition.y = event.clientY; } } handleMouseUp(event) { if (document.pointerLockElement === canvas) { this.isMouseDown = false; } } handleMouseMove(event) { if (document.pointerLockElement === canvas) { const currentTime = Date.now(); // Update current position this.currentMousePosition.x = event.clientX; this.currentMousePosition.y = event.clientY; // Debug logging every second // Calculate delta this.mouseDelta.x = event.movementX; this.mouseDelta.y = event.movementY; // Track total movement amount (for debugging) this.mouseMoveAmount.x += Math.abs(this.mouseDelta.x); this.mouseMoveAmount.y += Math.abs(this.mouseDelta.y); // Store current position as previous for next frame this.previousMousePosition.x = this.currentMousePosition.x; this.previousMousePosition.y = this.currentMousePosition.y; } } getMouseDelta() { return { ...this.mouseDelta }; } getDebugInfo() { return { delta: { ...this.mouseDelta }, current: { ...this.currentMousePosition }, previous: { ...this.previousMousePosition }, totalMovement: { ...this.mouseMoveAmount } }; } update() { // Reset delta at the end of each frame this.mouseDelta.x = 0; this.mouseDelta.y = 0; } } class AnimationController { constructor(model) { this.model = model; this.mixer = null; this.animations = new Map(); this.currentAnimation = null; this.isDeathAnimationPlaying = false; if (this.model) { this.mixer = new THREE.AnimationMixer(this.model); } } async loadAnimation(name, url) { try { const loader = new FBXLoader(); const animationFBX = await new Promise((resolve, reject) => { loader.load(url, resolve, undefined, reject); }); if (!this.mixer) { this.mixer = new THREE.AnimationMixer(this.model); } const animation = animationFBX.animations[0]; if (animation) { const action = this.mixer.clipAction(animation); if (name === 'death') { action.setLoop(THREE.LoopOnce); action.clampWhenFinished = true; } this.animations.set(name, action); console.log(`${name} animation loaded successfully`); return action; } } catch (error) { console.error(`Error loading ${name} animation:`, error); } } async loadAllAnimations() { const animationData = { idle: 'https://play.rosebud.ai/assets/anim_xbot_PistolIdle.fbx?2wMS', walk: 'https://play.rosebud.ai/assets/anim_xbot_PistolWalk.fbx?TbSV' }; const loadPromises = Object.entries(animationData).map(([name, url]) => this.loadAnimation(name, url) ); await Promise.all(loadPromises); // Play walk animation by default const walkAction = this.animations.get('walk'); if (walkAction) { walkAction.play(); this.currentAnimation = 'walk'; } } transitionToAnimation(newAnimation) { if (this.currentAnimation === newAnimation) return; const fadeTime = 0.5; const oldAction = this.animations.get(this.currentAnimation); const newAction = this.animations.get(newAnimation); if (newAction) { newAction.reset(); newAction.play(); if (oldAction) { newAction.crossFadeFrom(oldAction, fadeTime, true); } this.currentAnimation = newAnimation; } } playDeathAnimation() { if (this.isDeathAnimationPlaying) return; this.isDeathAnimationPlaying = true; if (this.mixer) { this.mixer.stopAllAction(); const deathAction = this.animations.get('death'); if (deathAction) { deathAction.reset(); deathAction.play(); return true; } } return false; } update(deltaTime) { if (this.mixer) { this.mixer.update(deltaTime); } } stopAllAnimations() { if (this.mixer) { this.mixer.stopAllAction(); } } dispose() { if (this.mixer) { this.mixer.stopAllAction(); this.mixer.uncacheRoot(this.model); this.animations.clear(); this.mixer = null; } } } class Enemy { constructor(scene) { // Scene reference this.scene = scene; // Initialize as null, will be created after mount exists this.gunController = null; this.gunMount = null; // Settings and configuration this.settings = APP_SETTINGS.enemy; // Rotation properties this.rotationSpeed = 5.0; // Radians per second this.targetQuaternion = new THREE.Quaternion(); this.currentQuaternion = new THREE.Quaternion(); // State label this.stateLabel = new StateLabel(this); // Physics body dimensions from settings this.bodyDimensions = new CANNON.Vec3( this.settings.dimensions.width, this.settings.dimensions.height, this.settings.dimensions.depth ); // Create physics body first as source of truth this.physicsBody = this.createPhysicsBody( this.bodyDimensions, new CANNON.Vec3( this.settings.position.x, this.settings.position.y, this.settings.position.z ) ); // Attack state tracking this.attackStartTime = 0; this.attackTimeElapsed = 0; // Core properties this.moveSpeed = this.settings.chaseSpeed; this.model = null; this.isLoaded = false; this.animationController = null; // Pathfinding properties this.pathfinder = null; this.currentPath = null; this.currentPathIndex = 0; this.pathUpdateInterval = 1000; this.lastPathUpdate = 0; this.minWaypointDistance = 1.0; // Recent points tracking this.recentPoints = []; this.maxRecentPoints = 5; this.recentPointThreshold = 2; // State machine properties this.currentState = APP_SETTINGS.enemyStates.CHASING; this.waitStartTime = 0; this.waitDuration = this.settings.waitDuration; } async loadModel() { try { const modelData = { url: MODEL_ASSETS.XBOT.url, type: MODEL_ASSETS.XBOT.type, scale: MODEL_ASSETS.XBOT.scale }; this.model = await window.ModelLoader.loadModel(modelData); if (this.model) { // Create gun mount at proper position but don't assign it const mountSettings = APP_SETTINGS.guns.pistol.mounts.enemy; this.gunMount = new GunMount( this.model, new THREE.Vector3( mountSettings.position.x, mountSettings.position.y, mountSettings.position.z ), new THREE.Vector3( mountSettings.rotation.x, mountSettings.rotation.y, mountSettings.rotation.z ) ); // Create gun controller now that we have a mount this.gunController = new GunController(this.gunMount); // Gun mount and controller initialized // Initialize animation controller this.animationController = new AnimationController(this.model); await this.animationController.loadAllAnimations(); // Initialize pathfinder after tilemap is created if (GameWorld.tilemap) { this.pathfinder = new AStar({ THREE: THREE, tileMap: GameWorld.tilemap, settings: APP_SETTINGS, pointSize: 1.5, pointColor: 0xff0000, lineColor: 0xffff00, lineWidth: 3 }); } // Setup the model this.setPosition(new THREE.Vector3( this.physicsBody.position.x, this.physicsBody.position.y, this.physicsBody.position.z )); this.model.scale.setScalar(modelData.scale); // Make the model and all its children raycastable this.model.traverse((child) => { if (child.isMesh) { child.raycast = THREE.Mesh.prototype.raycast; } }); // Add to scene this.scene.add(this.model); this.isLoaded = true; console.log('Enemy model loaded successfully'); } } catch (error) { console.error('Error loading enemy model:', error); } } createPhysicsBody(dimensions, position) { // Create the physics body shape const shape = new CANNON.Box(dimensions); // Create the physics body // Create a custom material for the enemy const enemyMaterial = new CANNON.Material('enemyMaterial'); const body = new CANNON.Body({ mass: 70, // Give it mass for proper physics shape: shape, material: enemyMaterial, position: position, linearDamping: 0.4, angularDamping: 0.99, fixedRotation: true, allowSleep: false }); body.collisionFilterGroup = APP_SETTINGS.physics.collisionGroups.ENEMY; body.collisionFilterMask = APP_SETTINGS.physics.collisionGroups.OBSTACLE | APP_SETTINGS.physics.collisionGroups.GROUND; window.GameWorld.physicsWorld.addBody(body); return body; } getPosition() { return new THREE.Vector3( this.physicsBody.position.x, this.physicsBody.position.y, this.physicsBody.position.z ); } setPosition(newPosition) { // Only update physics body - model will follow in update() this.physicsBody.position.set(newPosition.x, newPosition.y, newPosition.z); } enterState(state) { const currentTime = Date.now(); switch (state) { case APP_SETTINGS.enemyStates.CHASING: this.moveSpeed = this.settings.chaseSpeed; this.animationController.transitionToAnimation('walk'); break; case APP_SETTINGS.enemyStates.WAITING: this.waitStartTime = currentTime; this.moveSpeed = 0; this.animationController.transitionToAnimation('idle'); break; case APP_SETTINGS.enemyStates.ATTACKING: this.attackTimeElapsed = 0; this.attackStartTime = currentTime; this.moveSpeed = 0; this.animationController.transitionToAnimation('melee'); // Debug logging console.log('Entering ATTACKING state at time:', currentTime); break; } } executeStateAction(state, deltaTime, playerPosition) { switch (state) { case APP_SETTINGS.enemyStates.CHASING: this.executeChaseAction(deltaTime, playerPosition); break; case APP_SETTINGS.enemyStates.WAITING: this.executeWaitAction(deltaTime, playerPosition); break; case APP_SETTINGS.enemyStates.ATTACKING: this.executeAttackAction(deltaTime, playerPosition); break; } } exitState(state) { switch (state) { case APP_SETTINGS.enemyStates.CHASING: break; case APP_SETTINGS.enemyStates.WAITING: // No longer stopping animations here, letting transitionToAnimation handle it break; } } moveInDirection(targetPosition, deltaTime, lookAtTarget = true) { const currentPos = this.getPosition(); // Calculate direction vector const direction = new THREE.Vector3() .subVectors(targetPosition, currentPos) .setY(0) .normalize(); // Set velocity directly using moveSpeed const newVelocity = new CANNON.Vec3( direction.x * this.moveSpeed, this.physicsBody.velocity.y, // Preserve vertical velocity direction.z * this.moveSpeed ); // Apply velocity directly to physics body this.physicsBody.velocity.copy(newVelocity); // Handle rotation if needed if (lookAtTarget && this.model) { this.updateTargetRotation(targetPosition); } } executeChaseAction(deltaTime, playerPosition) { this.initializeDebugLogging(); const currentTime = Date.now(); const targetPosition = this.normalizeTargetPosition(playerPosition); this.updatePathIfNeeded(currentTime, playerPosition); this.handleMovement(deltaTime, playerPosition); } initializeDebugLogging() { if (!this.lastPathLog) this.lastPathLog = 0; } normalizeTargetPosition(playerPosition) { return playerPosition instanceof THREE.Vector3 ? playerPosition.clone() : new THREE.Vector3(playerPosition.x, playerPosition.y, playerPosition.z); } updatePathIfNeeded(currentTime, playerPosition) { if (currentTime - this.lastPathUpdate >= this.pathUpdateInterval) { this.updatePath(playerPosition); this.lastPathUpdate = currentTime; this.currentPathIndex = 0; if (currentTime - this.lastPathLog >= 1000) { this.lastPathLog = currentTime; } } } handleMovement(deltaTime, playerPosition) { if (this.currentPath && this.currentPathIndex < this.currentPath.length) { this.followPath(deltaTime); } else { this.moveInDirection(playerPosition, deltaTime); } } followPath(deltaTime) { if (!this.isValidPath()) return; const targetPoint = this.currentPath[this.currentPathIndex]; if (this.shouldSkipPoint(targetPoint)) return; // Move toward current waypoint this.moveInDirection(targetPoint, deltaTime); // Check if reached waypoint const horizontalDistance = this.getHorizontalDistanceToPoint(targetPoint); if (horizontalDistance < this.minWaypointDistance * 1.5) { this.handleWaypointReached(targetPoint); } } isValidPath() { return this.currentPath && this.currentPathIndex < this.currentPath.length; } shouldSkipPoint(targetPoint) { if (this.isPointRecentlyVisited(targetPoint)) { this.currentPathIndex++; return true; } return false; } getHorizontalDistanceToPoint(targetPoint) { const currentPos = this.getPosition(); // Only consider x and z coordinates for distance calculation return Math.sqrt( Math.pow(currentPos.x - targetPoint.x, 2) + Math.pow(currentPos.z - targetPoint.z, 2) ); } handleWaypointReached(targetPoint) { this.addRecentPoint(targetPoint); this.currentPathIndex++; if (this.currentPath && this.currentPathIndex >= this.currentPath.length) { this.currentPath = null; } } executeWaitAction(deltaTime, playerPosition) { // Set moveSpeed to 0 to ensure no movement const previousMoveSpeed = this.moveSpeed; this.moveSpeed = 0; // Use moveInDirection with lookAtTarget=true to handle rotation this.moveInDirection(playerPosition, true); // Restore previous move speed this.moveSpeed = previousMoveSpeed; } executeAttackAction(deltaTime, playerPosition) { if (this.model) { // Keep facing the player while attacking const targetPosition = new THREE.Vector3( playerPosition.x, this.model.position.y, playerPosition.z ); this.model.lookAt(targetPosition); // Update attack time elapsed (using real time instead of deltaTime) const currentTime = Date.now(); this.attackTimeElapsed = currentTime - this.attackStartTime; } } calculateDirectionToPlayer(playerPosition) { const currentPosition = this.getPosition(); return new THREE.Vector3( playerPosition.x - currentPosition.x, 0, // Keep y movement at 0 playerPosition.z - currentPosition.z ); } updateModelTransform() { if (!this.model) return; // Sync model position with physics body const physicsPos = this.getPosition(); this.model.position.copy(physicsPos); // Keep slightly above ground to prevent z-fighting this.model.position.y = Math.max(physicsPos.y, 0.1); // Apply smooth rotation this.model.quaternion.slerp(this.targetQuaternion, this.rotationSpeed * this.deltaTime); } updateTargetRotation(targetPosition) { if (!this.model) return; // Create a direction vector from current position to target const direction = new THREE.Vector3() .subVectors(targetPosition, this.model.position) .setY(0) .normalize(); // Create temporary object to calculate rotation const lookAtMatrix = new THREE.Matrix4(); lookAtMatrix.lookAt(new THREE.Vector3(), direction, new THREE.Vector3(0, 1, 0)); this.targetQuaternion.setFromRotationMatrix(lookAtMatrix); // Add 180 degrees rotation to fix backwards orientation const rotationFix = new THREE.Quaternion().setFromAxisAngle(new THREE.Vector3(0, 1, 0), Math.PI); this.targetQuaternion.multiply(rotationFix); } update(deltaTime, playerPosition) { if (!this.model || !playerPosition) { return; } // Debug logging every second if (!this.lastDebugLog) this.lastDebugLog = 0; const currentTime = Date.now(); if (currentTime - this.lastDebugLog >= 1000) { // Log every second const currentGun = window.GunManager?.getGunForHolder('enemy'); this.lastDebugLog = currentTime; } // Update gun mount and controller if they exist if (this.gunMount && this.gunController) { this.gunMount.update(deltaTime); const currentGun = window.GunManager?.getGunForHolder('enemy'); if (currentGun) { this.gunController.update(currentGun, false); } } else if (!this.gunController && this.gunMount) { // Initialize controller if mount exists but controller doesn't this.gunController = new GunController(this.gunMount); const currentGun = window.GunManager?.getGunForHolder('enemy'); if (currentGun) { this.gunController.update(currentGun, false); // Enemy doesn't use mouse input } } this.deltaTime = deltaTime; // Update animations through controller if (this.animationController) { this.animationController.update(deltaTime); } // Update visual model position from physics body this.updateModelTransform(); // Update state label if (this.stateLabel) { this.stateLabel.update(deltaTime, playerPosition); } const distanceToPlayer = this.getHorizontalDistanceToPoint(playerPosition); // State transition logic let newState = this.currentState; switch (this.currentState) { case APP_SETTINGS.enemyStates.CHASING: if (distanceToPlayer <= this.settings.startWaitingDistance) { newState = APP_SETTINGS.enemyStates.WAITING; } break; case APP_SETTINGS.enemyStates.WAITING: const waitTimeElapsed = currentTime - this.waitStartTime >= this.settings.waitDuration; if (waitTimeElapsed) { if (distanceToPlayer <= this.settings.startWaitingDistance) { if (APP_SETTINGS.controls.enableEnemyAttacking) { newState = APP_SETTINGS.enemyStates.ATTACKING; } else { this.waitStartTime = currentTime; // Reset wait timer newState = APP_SETTINGS.enemyStates.WAITING; // Continue waiting } } else { newState = APP_SETTINGS.enemyStates.CHASING; } } break; case APP_SETTINGS.enemyStates.ATTACKING: if (this.attackTimeElapsed >= this.settings.attackDuration) { newState = APP_SETTINGS.enemyStates.WAITING; } break; } // Handle state change if needed if (newState !== this.currentState) { this.exitState(this.currentState); this.currentState = newState; this.enterState(this.currentState); } // Execute current state action this.executeStateAction(this.currentState, deltaTime, playerPosition); } updatePath(playerPosition) { if (!this.pathfinder) return; // Convert Cannon.js physics position to Three.js vector const startPosition = new THREE.Vector3( this.physicsBody.position.x, this.physicsBody.position.y, this.physicsBody.position.z ); // Ensure playerPosition is a Three.js Vector3 const targetPosition = playerPosition instanceof THREE.Vector3 ? playerPosition.clone() : new THREE.Vector3(playerPosition.x, playerPosition.y, playerPosition.z); const path = this.pathfinder.findPath(startPosition, targetPosition); if (path) { // Filter out recently visited points from the path this.currentPath = path.filter(point => !this.isPointRecentlyVisited(point)); // Always call visualizePath, visibility is handled within the method this.pathfinder.visualizePath(this.currentPath); } } // Add a point to the recently visited points queue addRecentPoint(point) { this.recentPoints.push(new THREE.Vector3(point.x, point.y, point.z)); if (this.recentPoints.length > this.maxRecentPoints) { this.recentPoints.shift(); // Remove oldest point } } // Check if a point has been recently visited isPointRecentlyVisited(point) { return this.recentPoints.some(recentPoint => point.distanceTo(recentPoint) < this.recentPointThreshold ); } dispose() { if (this.stateLabel) { this.stateLabel.dispose(); this.stateLabel = null; } if (this.animationController) { this.animationController.dispose(); this.animationController = null; } if (this.model) { this.scene.remove(this.model); // Clean up geometries and materials this.model.traverse((child) => { if (child.isMesh) { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(material => material.dispose()); } else { child.material.dispose(); } } } }); this.model = null; this.isLoaded = false; } } dispose() { if (this.stateLabel) { this.stateLabel.dispose(); this.stateLabel = null; } if (this.animationController) { this.animationController.dispose(); this.animationController = null; } if (this.model) { this.scene.remove(this.model); this.model.traverse((child) => { if (child.isMesh) { if (child.geometry) child.geometry.dispose(); if (child.material) { if (Array.isArray(child.material)) { child.material.forEach(material => material.dispose()); } else { child.material.dispose(); } } } }); this.model = null; this.isLoaded = false; } } } class StateLabel { constructor(enemy) { this.enemy = enemy; this.visible = APP_SETTINGS.debug.showEnemyStateLabel; // Create the sprite const canvas = document.createElement('canvas'); canvas.width = 256; canvas.height = 128; this.context = canvas.getContext('2d'); // Create texture from canvas this.texture = new THREE.CanvasTexture(canvas); this.texture.minFilter = THREE.LinearFilter; this.texture.magFilter = THREE.LinearFilter; // Create sprite material const spriteMaterial = new THREE.SpriteMaterial({ map: this.texture, transparent: true }); // Create sprite this.sprite = new THREE.Sprite(spriteMaterial); this.sprite.scale.set(10, 5, 1); WorldScene.add(this.sprite); this.updateLabel(enemy.currentState); } updateLabel(state) { if (!this.visible) return; // Clear canvas this.context.clearRect(0, 0, 256, 128); // Set background this.context.fillStyle = 'rgba(0, 0, 255, 0.5)'; this.context.fillRect(0, 0, 256, 128); // Set text style this.context.fillStyle = 'white'; this.context.font = 'bold 48px Arial'; this.context.textAlign = 'center'; this.context.textBaseline = 'middle'; // Draw state text this.context.fillText(state, 128, 64); // Update texture this.texture.needsUpdate = true; } update(deltaTime, playerPosition) { if (!this.visible || !this.enemy.model) return; // Update position (above enemy) const enemyPosition = this.enemy.model.position.clone(); this.sprite.position.copy(enemyPosition); this.sprite.position.y += 30; // Position above enemy // Update label text if state changed if (this.lastState !== this.enemy.currentState) { this.updateLabel(this.enemy.currentState); this.lastState = this.enemy.currentState; } // Make sprite face camera if (MainCamera) { const cameraPosition = MainCamera.position.clone(); const direction = cameraPosition.sub(this.sprite.position); this.sprite.lookAt(cameraPosition); } } setVisible(visible) { this.visible = visible; this.sprite.visible = visible; } dispose() { if (this.sprite) { if (this.sprite.material) { this.sprite.material.dispose(); } if (this.sprite.material.map) { this.sprite.material.map.dispose(); } WorldScene.remove(this.sprite); } this.enemy = null; this.context = null; this.texture = null; this.sprite = null; } } class GunController { constructor(mount) { this.currentTime = 0; this.mount = mount; } assignMount(gun) { if (!gun || !this.mount) { return; } gun.mount = this.mount; } update(currentGun, isMouseDown) { if (!currentGun) return; this.currentTime = Date.now(); let newGunState = currentGun.currentState; switch (currentGun.currentState) { case currentGun.states.IDLE: if (currentGun.currentAmmo <= 0 && currentGun.canReload()) { newGunState = currentGun.states.RELOADING; } else if (currentGun.canShoot(this.currentTime, isMouseDown)) { newGunState = currentGun.states.SHOOTING; } break; case currentGun.states.SHOOTING: if (currentGun.currentAmmo <= 0 && currentGun.canReload()) { newGunState = currentGun.states.RELOADING; } else if (currentGun.isShootingComplete()) { newGunState = currentGun.states.IDLE; } break; case currentGun.states.RELOADING: if (currentGun.isReloadComplete()) { newGunState = currentGun.states.IDLE; } break; } // Handle gun state change if needed if (newGunState !== currentGun.currentState) { currentGun.exitState(currentGun.currentState); currentGun.currentState = newGunState; currentGun.enterState(newGunState); } } } class Player { constructor(camera) { // Player states this.states = { IDLE: 'IDLE', SHOOTING: 'SHOOTING', RELOADING: 'RELOADING', }; this.currentState = this.states.IDLE; this.previousState = null; this.moveSpeed = APP_SETTINGS.controls.playerMoveSpeed; this.velocity = new THREE.Vector3(); this.camera = camera; this.position = new THREE.Vector3( APP_SETTINGS.player.initialPosition.x, APP_SETTINGS.player.initialPosition.y, APP_SETTINGS.player.initialPosition.z ); // Get mount settings from APP_SETTINGS const mountSettings = APP_SETTINGS.guns.pistol.mounts.player; // Initialize gun mount with settings this.gunMount = new GunMount( this.camera, new THREE.Vector3( mountSettings.position.x, mountSettings.position.y, mountSettings.position.z ), new THREE.Vector3( mountSettings.rotation.x, mountSettings.rotation.y, mountSettings.rotation.z ) ); // Initialize GunController with the gun mount this.gunController = new GunController(this.gunMount); this.keys = { forward: false, backward: false, left: false, right: false }; // Create physics body with default parameters this.createPhysicsBody( new CANNON.Vec3(1, 15, 1), // Taller collision box new CANNON.Vec3( APP_SETTINGS.player.initialPosition.x, APP_SETTINGS.player.initialPosition.y, APP_SETTINGS.player.initialPosition.z ) // Initial position from settings ); this.initKeyBindings(); } createPhysicsBody(dimensions, position) { // Create the physics body shape const shape = new CANNON.Box(dimensions); // Create the physics body this.physicsBody = new CANNON.Body({ mass: 70, // Average human mass in kg shape: shape, material: window.GameWorld.physicsWorld.defaultMaterial, position: position, linearDamping: 0.9, // Add some drag to movement fixedRotation: true // Prevent player from tipping over }); // Set collision groups this.physicsBody.collisionFilterGroup = APP_SETTINGS.physics.collisionGroups.PLAYER; this.physicsBody.collisionFilterMask = APP_SETTINGS.physics.collisionGroups.GROUND | APP_SETTINGS.physics.collisionGroups.OBSTACLE; // Add to physics world window.GameWorld.physicsWorld.addBody(this.physicsBody); } getPosition() { return this.position.clone(); } initKeyBindings() { document.addEventListener('keydown', (event) => { switch (event.code) { case 'KeyP': // Add new case for physics debug toggle if (GameWorld && GameWorld.tilemap) { GameWorld.tilemap.togglePhysicsDebug(); } break; case 'KeyW': this.keys.forward = true; break; case 'KeyS': this.keys.backward = true; break; case 'KeyA': this.keys.left = true; break; case 'KeyD': this.keys.right = true; break; case 'KeyR': // Get current gun and check if it can be reloaded const currentGun = window.GunManager?.getGunForHolder('player'); if (currentGun && !currentGun.isReloading && currentGun.currentAmmo < currentGun.maxAmmo) { currentGun.reload(); } break; } }); document.addEventListener('keyup', (event) => { switch (event.code) { case 'KeyW': this.keys.forward = false; break; case 'KeyS': this.keys.backward = false; break; case 'KeyA': this.keys.left = false; break; case 'KeyD': this.keys.right = false; break; } }); } update(deltaTime) { const newPlayerState = this.getState(); const isMouseDown = window.Input.isMouseDown; // Sync camera position with player position this.camera.position.copy(this.position); // Update gun mount and controller const currentGun = window.GunManager?.getGunForHolder('player'); if (currentGun) { // Update gun mount first to ensure latest player/camera position this.gunMount.update(deltaTime); // Then update gun controller with latest mount position this.gunController.update(currentGun, isMouseDown); // Make sure the gun's mount is assigned if (currentGun.mount !== this.gunMount) { this.gunController.assignMount(currentGun); } } // Handle player state transition if state has changed if (newPlayerState !== this.currentState) { this.exitState(this.currentState); this.previousState = this.currentState; this.currentState = newPlayerState; this.enterState(this.currentState); } // Execute current state action this.executeStateAction(this.currentState, deltaTime); // Update physics and position const moveDirection = this.handleMovementInput(); this.updatePhysics(moveDirection); this.updatePosition(); } getState() { // For now, just return current state since we haven't implemented state transitions return this.currentState; } enterState(state) { switch (state) { case this.states.IDLE: break; case this.states.SHOOTING: break; case this.states.RELOADING: break; } } exitState(state) { switch (state) { case this.states.IDLE: break; case this.states.SHOOTING: break; case this.states.RELOADING: break; } } executeStateAction(state, deltaTime) { switch (state) { case this.states.IDLE: break; case this.states.SHOOTING: break; case this.states.RELOADING: break; } } handleMovementInput() { // Get movement directions based on camera orientation const forward = window.CameraControl.getForwardVector(); const right = window.CameraControl.getRightVector(); // Remove vertical component for horizontal-only movement forward.y = 0; right.y = 0; forward.normalize(); right.normalize(); // Calculate movement direction const moveDirection = new CANNON.Vec3(0, 0, 0); // Add movement based on key states if (this.keys.forward) moveDirection.vadd(new CANNON.Vec3(forward.x, 0, forward.z), moveDirection); if (this.keys.backward) moveDirection.vsub(new CANNON.Vec3(forward.x, 0, forward.z), moveDirection); if (this.keys.right) moveDirection.vadd(new CANNON.Vec3(right.x, 0, right.z), moveDirection); if (this.keys.left) moveDirection.vsub(new CANNON.Vec3(right.x, 0, right.z), moveDirection); return moveDirection; } updatePhysics(moveDirection) { if (moveDirection.length() > 0) { moveDirection.normalize(); moveDirection.scale(this.moveSpeed, moveDirection); // Set velocity directly for responsive movement this.physicsBody.velocity.x = moveDirection.x; this.physicsBody.velocity.z = moveDirection.z; // Preserve vertical velocity (for gravity) this.physicsBody.velocity.y = this.physicsBody.velocity.y; } else { // Apply friction when no movement keys are pressed this.physicsBody.velocity.x *= 0.9; this.physicsBody.velocity.z *= 0.9; } } updatePosition() { // Update position from physics body this.position.set( this.physicsBody.position.x, this.physicsBody.position.y, this.physicsBody.position.z ); // Update camera position this.camera.position.copy(this.position); } } class App { constructor() { this.createRenderDivs(); this.clock = new THREE.Clock(); this.initialLoadingComplete = false; this.spriteSheet = null; this.deltaTime = 0; this.init(); } loadScript(url) { return new Promise((resolve, reject) => { if (document.querySelector(`script[src="${url}"]`)) { resolve(); return; } var script = document.createElement('script'); script.type = 'text/javascript'; script.src = url; script.onload = () => resolve(); script.onerror = () => reject(new Error('Script loading failed for ' + url)); document.head.appendChild(script); }); } async loadScripts() { try { for (const script of SCRIPT_ASSETS) { await this.loadScript(script.url); console.log(`Script loaded: ${script.name}`); } } catch (error) { console.error('Error loading scripts:', error); } } async init() { // Load external scripts first await this.loadScripts(); window.LoadingManager = new THREE.LoadingManager(); this.setupLoadingManager(); window.Textures = TextureManager(); window.Materials = MaterialManager(); window.Meshes = MeshManager(); window.Lights = LightingManager(); window.ModelLoader = new ModelLoader(); window.GameWorld = new World(); window.AudioPlayer = new AudioPlayer({ THREE: THREE, camera: MainCamera, LoadingManager: window.LoadingManager, soundAssets: SOUND_ASSETS }); window.Input = new InputHandler(); window.CameraControl = new CameraController({ THREE: THREE, camera: MainCamera, settings: APP_SETTINGS }); window.Player = new Player(MainCamera); window.GunManager = new GunManager(WorldScene, MainCamera); // Initialize GunManager and assign holder await window.GunManager.initialize(); window.GunManager.assignHolder('player', window.Player); // Create tilemap first GameWorld.createTilemap(); // Create AmmoDisplay with proper parameters window.AmmoDisplay = new AmmoDisplay({ uiContainer: window.uiDiv, position: { left: '30px', bottom: '30px' }, style: { backgroundColor: 'rgba(0, 0, 0, 0.5)', padding: '15px', borderRadius: '8px' }, iconSize: { width: '36px', height: '36px' }, textStyle: { color: 'white', fontSize: '30px', fontFamily: 'Arial, sans-serif' } }); await this.createEnemy(); // Initialize and assign initial guns to player and enemy try { await Promise.all([ window.GunManager.assignGunToHolder('player', 'pistol'), window.GunManager.assignGunToHolder('enemy', 'pistol') ]); console.log('Initial guns initialized and assigned to player and enemy'); } catch (error) { console.error('Failed to initialize gun system:', error); } // Create crosshair with parameters window.Crosshair = new Crosshair({ uiContainer: window.uiDiv, initialColor: '#ff0000', initialSize: 30, initialThickness: 3 }); // Wait for textures to load before creating UI elements this.waitForTexturesAndInitUI(); this.addEventListeners(); } async createEnemy() { if (!APP_SETTINGS.controls.createEnemyOnStart || !GameWorld.tilemap) { console.warn('Enemy creation skipped: createEnemyOnStart:', APP_SETTINGS.controls.createEnemyOnStart, 'tilemap ready:', !!GameWorld.tilemap); return; } try { window.Enemy = new Enemy(WorldScene); await window.Enemy.loadModel(); // Assign enemy as a gun holder window.GunManager.assignHolder('enemy', window.Enemy); console.log('Enemy initialized and loaded with pathfinding ready'); } catch (error) { console.error('Failed to create enemy:', error); } } waitForTexturesAndInitUI() { Promise.all([ Textures.loadTextures(), window.AudioPlayer.loadSoundAssets() ]).then(() => { if (Textures.texturesLoaded) { console.log('All assets loaded successfully'); } }).catch(error => { console.error('Error loading assets:', error); setTimeout(() => this.waitForTexturesAndInitUI(), 100); }); } 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); CameraControl.update(); window.Player.update(this.deltaTime); Input.update(); window.GunManager.update(this.deltaTime); // Update enemy if it's loaded if (APP_SETTINGS.controls.createEnemyOnStart && window.Enemy && window.Enemy.isLoaded) { const playerPosition = window.Player.getPosition(); window.Enemy.update(this.deltaTime, playerPosition); } if (this.worldClock) { this.worldClock.update(GameWorld.Time); } else { //console.warn('WorldClock not initialized'); } } } 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); } } window.Game = new App(); Game.start();