// 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'; /* This is where external user components are loaded into scope. This seems like the simplest solution to this problem as it does not require modifications to the Script loader. This requires an export statement at the end of the user script with the desires export components added. Components can be removed from this import statement to completely remove them without having to modify the external script contents - meaning it can hold objects that aren't even used in this script for later use. */ import { MaterialManager, LightingManager, MeshManager } from 'https://play.rosebud.ai/assets/ThreeJSScripts.js?hZgy'; const MODEL_ASSETS = { MAC10: { url: 'https://play.rosebud.ai/assets/mac_10_01.glb?K38F', type: 'glb', scale: 0.017 }, PISTOL: { url: 'https://play.rosebud.ai/assets/01_gun_fbx.fbx?3ijb', type: 'fbx', scale: 0.06 }, SNIPER: { url: 'https://play.rosebud.ai/assets/308_sniper_rifle_freegameready.glb?4Y2P', type: 'glb', scale: 0.01 }, CHARACTER: { url: 'https://play.rosebud.ai/assets/mc_character_model.obj?1v5W', type: 'obj', scale: 1 }, 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.3 }, gunShot: { url: 'https://play.rosebud.ai/assets/snd_pistol_shot.wav?V6gU', volume: 0.03 } }, music: { // Reserved for background music }, ambient: { // Reserved for ambient sounds } }; const APP_SETTINGS = { tilemap: { width: 10, height: 10, tileSize: 20, obstacleCount: 5 }, 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, mouseSensitivity: { x: 0.002, y: 0.002 }, 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' }, physics: { gravity: { x: 0, y: -9.81, z: 0 }, defaultContactMaterial: { friction: 0.01, restitution: 0.6 }, solver: { iterations: 10, tolerance: 0.001 } }, enemy: { slenderman: { position: { x: 0, y: 18, // Set to 15 units height z: -50 }, chaseSpeed: 10, waitDuration: 2000, startWaitingDistance: 20 } }, camera: { fov: 75, near: 0.1, far: 1000, initialPosition: { x: 0, y: 50, z: 100 } }, enableMuzzleFlash: false, player: { moveSpeed: 30, sensitivity: { x: 0.002, y: 0.002 } }, gameplay: {}, guns: { pistol: { name: "Pistol", fireRate: { isAutomatic: false, cooldown: 250 }, model: { ...MODEL_ASSETS.PISTOL }, texture: { url: 'https://play.rosebud.ai/assets/BLK64.png?B9l1' }, sound: { ...SOUND_ASSETS.effects.gunShot }, position: { default: { x: 0.24, y: -0.36, z: -0.48 }, ads: { x: 0, y: -0.2, z: -0.1 } }, rotation: { default: { x: 0, y: Math.PI, z: 0 }, ads: { x: 0, y: Math.PI, z: 0 } }, muzzleFlash: { size: 0.05, color: 0xffff00, duration: 20 }, adsToggle: { enabled: true, transitionSpeed: 0.1 }, fov: { default: 75, ads: 55, transitionSpeed: 0.1 } }, smg: { name: "SMG", fireRate: { isAutomatic: true, cooldown: 100 }, model: { ...MODEL_ASSETS.MAC10 }, texture: { url: 'https://play.rosebud.ai/assets/BLK64.png?B9l1' }, sound: { ...SOUND_ASSETS.effects.gunShot }, position: { default: { x: 0.06, y: -0.08, z: -0.15 }, ads: { x: 0, y: -0.05, z: -0.1 } }, rotation: { default: { x: 0, y: -Math.PI / 2, z: 0 }, ads: { x: 0, y: -Math.PI / 2, z: 0 } }, muzzleFlash: { size: 0.06, color: 0xffff00, duration: 25 }, adsToggle: { enabled: true, transitionSpeed: 0.12 }, fov: { default: 75, ads: 60, transitionSpeed: 0.12 } }, sniper: { name: "Sniper", fireRate: { isAutomatic: false, cooldown: 1000 }, model: { ...MODEL_ASSETS.SNIPER }, texture: { url: 'https://play.rosebud.ai/assets/BLK64.png?B9l1' }, sound: { ...SOUND_ASSETS.effects.gunShot }, position: { default: { x: 0.2, y: -0.35, z: -0.85 }, ads: { x: 0, y: -0.235, z: -0.55 } }, rotation: { default: { x: 0, y: Math.PI / 2, z: 0 }, ads: { x: 0, y: Math.PI / 2, z: 0 } }, muzzleFlash: { size: 0.07, color: 0xffff00, duration: 30 }, adsToggle: { enabled: true, transitionSpeed: 0.15 }, fov: { default: 70, ads: 30, transitionSpeed: 0.15 } } }, lights: { sunlight: { color: 0xffffff, intensity: 1.5, position: { x: -50, y: 100, 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 Gun { constructor(scene, camera, model, texture, sound, settings) { this.scene = scene; this.camera = camera; this.model = model; this.texture = texture; this.shootSound = sound; this.wasMouseDown = false; // Track previous mouse state if (this.shootSound && settings.sound && typeof settings.sound.volume === 'number') { this.shootSound.setVolume(settings.sound.volume); } this.settings = settings; this.muzzleFlash = null; this.isADS = false; this.isTransitioning = false; this.lastShotTime = 0; this.isAutomatic = settings.fireRate.isAutomatic; this.cooldown = settings.fireRate.cooldown; this.ray = new Ray(new THREE.Vector3(), new THREE.Vector3()); this.defaultPosition = { ...settings.position.default }; this.adsPosition = { ...settings.position.ads }; this.currentPosition = { ...this.defaultPosition }; this.currentRotation = { ...settings.rotation.default }; this.currentFOV = settings.fov.default; this.setupModel(); } setupModel() { if (this.model && this.texture) { this.model.scale.setScalar(this.settings.model.scale); 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) { if (this.isTransitioning) { this.transitionProgress += deltaTime / this.settings.adsToggle.transitionSpeed; this.transitionProgress = Math.min(this.transitionProgress, 1); const startPos = this.isADS ? this.defaultPosition : this.adsPosition; const endPos = this.isADS ? this.adsPosition : this.defaultPosition; const startRot = this.isADS ? this.settings.rotation.default : this.settings.rotation.ads; const endRot = this.isADS ? this.settings.rotation.ads : this.settings.rotation.default; const startFOV = this.isADS ? this.settings.fov.default : this.settings.fov.ads; const endFOV = this.isADS ? this.settings.fov.ads : this.settings.fov.default; this.currentPosition = { x: this.lerp(startPos.x, endPos.x, this.transitionProgress), y: this.lerp(startPos.y, endPos.y, this.transitionProgress), z: this.lerp(startPos.z, endPos.z, this.transitionProgress) }; this.currentRotation = { x: this.lerp(startRot.x, endRot.x, this.transitionProgress), y: this.lerp(startRot.y, endRot.y, this.transitionProgress), z: this.lerp(startRot.z, endRot.z, this.transitionProgress) }; this.currentFOV = this.lerp(startFOV, endFOV, this.transitionProgress); if (this.transitionProgress === 1) { this.isTransitioning = false; } } const gunPosition = new THREE.Vector3( this.currentPosition.x, this.currentPosition.y, this.currentPosition.z ); gunPosition.applyQuaternion(this.camera.quaternion); this.model.position.copy(gunPosition.add(this.camera.position)); this.model.rotation.set( this.currentRotation.x, this.currentRotation.y, this.currentRotation.z ); this.model.quaternion.premultiply(this.camera.quaternion); this.camera.fov = this.currentFOV; this.camera.updateProjectionMatrix(); } } lerp(start, end, t) { return start * (1 - t) + end * t; } 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()); if (window.Enemy && window.Enemy.model) { const intersection = this.ray.checkIntersection(window.Enemy.model); if (intersection) { window.AudioPlayer.play('bulletHit'); console.log('Enemy hit!', { distance: intersection.distance, point: intersection.point, modelName: intersection.object.name || 'unnamed mesh' }); } return intersection; } return null; } update(deltaTime) { if (!window.Input) return; const currentTime = Date.now(); const cooldownPassed = currentTime - this.lastShotTime >= this.cooldown; const isMouseDown = window.Input.isMouseDown; if (!cooldownPassed) return; // Handle automatic weapons if (this.isAutomatic) { if (isMouseDown) { this.performShot(); } return; } // Handle single-fire weapons // Only shoot on the rising edge of the mouse press if (isMouseDown && !this.wasMouseDown) { this.performShot(); } // Update previous mouse state this.wasMouseDown = isMouseDown; } performShot() { this.playShootSound(); this.performRaycast(); this.lastShotTime = Date.now(); } 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.currentGun = null; this.loadedGuns = new Map(); } async loadGun(gunType) { if (this.loadedGuns.has(gunType)) { return this.loadedGuns.get(gunType); } const gunSettings = APP_SETTINGS.guns?.[gunType]; if (!gunSettings) { console.error(`Gun type ${gunType} not found in settings`); return null; } try { 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); this.loadedGuns.set(gunType, gun); return gun; } catch (error) { console.error(`Error loading gun ${gunType}:`, error); return null; } } async switchGun(gunType) { if (this.currentGun) { this.currentGun.hide(); } const newGun = await this.loadGun(gunType); if (newGun) { this.currentGun = newGun; this.currentGun.show(); } return newGun; } getCurrentGun() { return this.currentGun; } update(deltaTime) { if (this.currentGun) { this.currentGun.updatePosition(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(); } } const StarNestShader = { uniforms: { 'tDiffuse': { value: null }, 'iTime': { value: 0 }, 'iResolution': { value: new THREE.Vector2() } }, vertexShader: ` varying vec2 vUv; void main() { vUv = uv; gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0); } `, fragmentShader: ` uniform float iTime; uniform vec2 iResolution; uniform vec2 iMouse; uniform sampler2D tDiffuse; varying vec2 vUv; #define iterations 17 #define formuparam 0.53 #define volsteps 20 #define stepsize 0.1 #define zoom 0.800 #define tile 0.850 #define speed 0.010 #define brightness 0.0015 #define darkmatter 0.300 #define distfading 0.730 #define saturation 0.850 void mainImage( out vec4 fragColor, in vec2 fragCoord ) { //get coords and direction vec2 uv=fragCoord.xy/iResolution.xy-.5; uv.y*=iResolution.y/iResolution.x; vec3 dir=vec3(uv*zoom,1.); float time=iTime*speed+.25; // Fixed view direction without rotation vec3 from=vec3(1.,.5,0.5); from+=vec3(time*2.,time,-2.); //volumetric rendering float s=0.1,fade=1.; vec3 v=vec3(0.); for (int r=0; r6) fade*=1.-dm; // dark matter, don't render near //v+=vec3(dm,dm*.5,0.); v+=fade; v+=vec3(s,s*s,s*s*s*s)*a*brightness*fade; // coloring based on distance fade*=distfading; // distance fading s+=stepsize; } v=mix(vec3(length(v)),v,saturation); //color adjust fragColor = vec4(v*.01,1.); } void main() { vec4 fragColor; mainImage(fragColor, gl_FragCoord.xy); gl_FragColor = fragColor; } ` }; 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); this.skyMesh.position.set(0, 0, 0); // Fix position at world origin this.skyMesh.matrixAutoUpdate = false; // Disable automatic matrix updates // Create and apply the StarNest shader material this.shaderMaterial = new THREE.ShaderMaterial({ ...StarNestShader, side: THREE.BackSide, transparent: false, depthWrite: false, depthTest: true }); this.shaderMaterial.uniforms.iResolution.value.set(window.innerWidth, window.innerHeight); this.shaderMaterial.uniforms.iTime.value = 0; this.skyMesh.material = this.shaderMaterial; WorldScene.add(this.skyMesh); console.log('Skybox created with StarNestShader'); this.updateSunPosition(); }); } update(deltaTime) { if (this.shaderMaterial && this.skyMesh) { // Reset position to ensure skybox stays fixed this.skyMesh.position.set(0, 0, 0); // Update shader uniforms this.shaderMaterial.uniforms.iTime.value += deltaTime; this.shaderMaterial.uniforms.iResolution.value.set(window.innerWidth, window.innerHeight); // Update material this.shaderMaterial.needsUpdate = true; } this.updateSunPosition(); } updateSunPosition() { if (this.shaderMaterial && Lights.getLight('sunLight')) { const sunLight = Lights.getLight('sunLight'); const sunDirection = new THREE.Vector3(); sunLight.getWorldDirection(sunDirection); // StarNestShader doesn't use sun position, so we'll skip updating it } } 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.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) => { 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; } const tileMapGenerator = new TileMapGenerator( APP_SETTINGS.tilemap.width, APP_SETTINGS.tilemap.height ); this.tilemap = tileMapGenerator.generateMap(); const tilemapMesh = this.tilemap.render(); WorldScene.add(tilemapMesh); // Add grid lines for visual reference const gridLines = this.tilemap.createGridLines(); WorldScene.add(gridLines); return this.tilemap; } 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.initControls(); } initControls() { document.addEventListener('mousemove', this.mouseHandler); document.addEventListener('click', () => { canvas.requestPointerLock(); }); document.addEventListener('mousedown', this.mouseDownHandler); document.addEventListener('mouseup', (event) => this.handleMouseUp(event)); } handleMouseDown(event) { if (document.pointerLockElement === canvas) { this.isMouseDown = true; } } handleMouseUp(event) { if (document.pointerLockElement === canvas) { this.isMouseDown = false; } } handleMouseMove(event) { if (document.pointerLockElement === canvas) { window.CameraControl.handleMouseMovement(event.movementX, event.movementY); } } update() { // Update any other input handling here } } class Enemy { constructor(scene) { // Scene reference this.scene = scene; // Settings and configuration this.settings = APP_SETTINGS.enemy.slenderman; this.moveSpeed = this.settings.chaseSpeed; // Position and model this.position = new THREE.Vector3( this.settings.position.x, this.settings.position.y, this.settings.position.z ); this.model = null; this.isLoaded = false; // 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.SLENDERMAN.url, type: MODEL_ASSETS.SLENDERMAN.type, scale: MODEL_ASSETS.SLENDERMAN.scale }; this.model = await window.ModelLoader.loadModel(modelData); if (this.model) { // Initialize pathfinder after tilemap is created if (GameWorld.tilemap) { this.pathfinder = new AStar(GameWorld.tilemap); } // Setup the model this.setPosition(this.position); 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); } } setPosition(position) { // Update internal position this.position.copy(position); // Update model position if it exists if (this.model) { this.model.position.copy(position); // Ensure position is slightly above ground to prevent z-fighting this.model.position.y = Math.max(position.y, 0.1); } } enterState(state) { switch (state) { case APP_SETTINGS.enemyStates.CHASING: this.moveSpeed = this.settings.chaseSpeed; break; case APP_SETTINGS.enemyStates.WAITING: this.waitStartTime = Date.now(); this.moveSpeed = 0; // Set movement speed to 0 when waiting 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; } } exitState(state) { switch (state) { case APP_SETTINGS.enemyStates.CHASING: break; case APP_SETTINGS.enemyStates.WAITING: break; } } executeChaseAction(deltaTime, playerPosition) { // Check if we need to update the path const currentTime = Date.now(); if (currentTime - this.lastPathUpdate >= this.pathUpdateInterval) { this.updatePath(playerPosition); this.lastPathUpdate = currentTime; this.currentPathIndex = 0; } // Check if we have a valid path if (!this.currentPath || this.currentPathIndex >= this.currentPath.length) { // No valid path, use direct movement const direction = this.calculateDirectionToPlayer(playerPosition); const normalizedDirection = direction.clone().normalize(); const movement = normalizedDirection.multiplyScalar(this.moveSpeed * deltaTime); const newPosition = this.position.clone().add(movement); this.setPosition(newPosition); } else { // Follow the current path this.followPath(deltaTime); } if (this.model) { this.model.lookAt(playerPosition); } } followPath(deltaTime) { const currentPoint = this.position; const targetPoint = this.currentPath[this.currentPathIndex]; // Check if target point is in recently visited points if (this.isPointRecentlyVisited(targetPoint)) { this.currentPathIndex++; return; } // Calculate direction vector to target (only x and z components) const direction = new THREE.Vector3( targetPoint.x - currentPoint.x, 0, targetPoint.z - currentPoint.z ); // Calculate distance to current target const distanceToTarget = direction.length(); if (distanceToTarget < this.minWaypointDistance) { // Add current point to recently visited points this.addRecentPoint(targetPoint); // Move to next path point this.currentPathIndex++; } else { // Normalize direction and apply movement speed direction.normalize(); // Calculate movement distance for this frame const moveDistance = this.moveSpeed * deltaTime; // Create new position by adding scaled direction to current position const newPosition = new THREE.Vector3( currentPoint.x + direction.x * moveDistance, this.position.y, // Maintain current height currentPoint.z + direction.z * moveDistance ); this.setPosition(newPosition); } } executeWaitAction(deltaTime, playerPosition) { if (this.model) { // Keep facing the player while waiting, but don't move this.model.lookAt(playerPosition); // Ensure position stays fixed during waiting state this.setPosition(this.position); } } calculateDirectionToPlayer(playerPosition) { return new THREE.Vector3( playerPosition.x - this.position.x, 0, // Keep y movement at 0 playerPosition.z - this.position.z ); } shouldTransitionState(playerPosition) { const distanceToPlayer = this.calculateDirectionToPlayer(playerPosition).length(); switch (this.currentState) { case APP_SETTINGS.enemyStates.CHASING: // Transition to WAITING if we're close enough to player return distanceToPlayer <= this.settings.startWaitingDistance; case APP_SETTINGS.enemyStates.WAITING: // Transition to CHASING if wait time is over const waitTimeElapsed = Date.now() - this.waitStartTime >= this.settings.waitDuration; return waitTimeElapsed; default: return false; } } update(deltaTime, playerPosition) { if (!this.model || !playerPosition) { return; } // Check for state transition if (this.shouldTransitionState(playerPosition)) { this.exitState(this.currentState); // Toggle between states this.currentState = this.currentState === APP_SETTINGS.enemyStates.CHASING ? APP_SETTINGS.enemyStates.WAITING : APP_SETTINGS.enemyStates.CHASING; this.enterState(this.currentState); } // Execute current state action this.executeStateAction(this.currentState, deltaTime, playerPosition); } updatePath(playerPosition) { if (!this.pathfinder) return; const path = this.pathfinder.findPath(this.position, playerPosition); 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.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; } } } class Player { constructor(camera) { this.moveSpeed = APP_SETTINGS.controls.playerMoveSpeed; this.velocity = new THREE.Vector3(); this.camera = camera; this.position = new THREE.Vector3(0, 15, 0); // Set to 15 units height offset this.keys = { forward: false, backward: false, left: false, right: false }; this.initKeyBindings(); } getPosition() { return this.position.clone(); } initKeyBindings() { document.addEventListener('keydown', (event) => { switch (event.code) { 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; } }); 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) { // Reset velocity this.velocity.set(0, 0, 0); // 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 based on key states if (this.keys.forward) this.velocity.add(forward.multiplyScalar(this.moveSpeed)); if (this.keys.backward) this.velocity.sub(forward.multiplyScalar(this.moveSpeed)); if (this.keys.right) this.velocity.add(right.multiplyScalar(this.moveSpeed)); if (this.keys.left) this.velocity.sub(right.multiplyScalar(this.moveSpeed)); // Apply movement this.position.addScaledVector(this.velocity, deltaTime); // Update camera position this.camera.position.copy(this.position); } } class Ray { constructor(origin, direction) { this.ray = new THREE.Raycaster(); this.update(origin, direction); } update(origin, direction) { if (!origin || !direction) { console.warn('Ray: Invalid origin or direction'); return; } this.ray.set(origin, direction); } checkIntersection(object) { if (!object || !this.ray) { console.warn('Ray: Cannot check intersection - invalid object or ray'); return null; } const intersects = this.ray.intersectObject(object, true); return intersects.length > 0 ? intersects[0] : null; } dispose() { this.ray = null; } } class CameraController { constructor(camera) { this.camera = camera; this.rotationX = 0; this.rotationY = 0; this.sensitivityX = APP_SETTINGS.controls.mouseSensitivity.x; this.sensitivityY = APP_SETTINGS.controls.mouseSensitivity.y; this.maxPolarAngle = Math.PI / 2 - 0.1; this.minPolarAngle = -Math.PI / 2 + 0.1; } handleMouseMovement(movementX, movementY) { this.rotationX -= movementX * this.sensitivityX; this.rotationY -= movementY * this.sensitivityY; this.rotationY = Math.max(this.minPolarAngle, Math.min(this.maxPolarAngle, this.rotationY)); } update() { this.camera.rotation.order = 'YXZ'; this.camera.rotation.x = this.rotationY; this.camera.rotation.y = this.rotationX; } setSensitivity(sensitivityX, sensitivityY) { this.sensitivityX = sensitivityX; this.sensitivityY = sensitivityY; } setPosition(position) { this.camera.position.copy(position); } getForwardVector() { const forwardVector = new THREE.Vector3(0, 0, -1); forwardVector.applyQuaternion(this.camera.quaternion); return forwardVector; } getRightVector() { const rightVector = new THREE.Vector3(1, 0, 0); rightVector.applyQuaternion(this.camera.quaternion); return rightVector; } } class Tile { constructor(x, z, size) { this.x = x; this.z = z; this.size = size; this.mesh = null; this.body = null; this.createMesh(); } createMesh() { const geometry = new THREE.BoxGeometry(this.size, 0.1, this.size); const material = this.createTileMaterial(); this.mesh = new THREE.Mesh(geometry, material); this.mesh.position.set(this.x, 0, this.z); this.mesh.receiveShadow = true; } createTileMaterial() { return Materials.create('tileMaterial', 'standard', { color: 0xFFFFFF, roughness: 0.7, metalness: 0.3 }); } } class TileMap { constructor(width, height, tileSize) { this.width = width; this.height = height; this.tileSize = tileSize; this.tiles = []; this.mapMesh = new THREE.Group(); this.occupiedPositions = new Set(); this.navMesh = null; this.createTiles(); } createTiles() { for (let x = 0; x < this.width; x++) { for (let z = 0; z < this.height; z++) { const tileX = (x - this.width / 2 + 0.5) * this.tileSize; const tileZ = (z - this.height / 2 + 0.5) * this.tileSize; const tile = new Tile(tileX, tileZ, this.tileSize); this.tiles.push(tile); this.mapMesh.add(tile.mesh); } } } getTileAt(x, z) { return this.tiles[x * this.height + z]; } render() { return this.mapMesh; } createGridLines() { const material = new THREE.LineBasicMaterial({ color: 0x000000 }); const points = []; for (let x = 0; x <= this.width; x++) { const xPos = (x - this.width / 2) * this.tileSize; points.push(new THREE.Vector3(xPos, 0.1, -this.height * this.tileSize / 2)); points.push(new THREE.Vector3(xPos, 0.1, this.height * this.tileSize / 2)); } for (let z = 0; z <= this.height; z++) { const zPos = (z - this.height / 2) * this.tileSize; points.push(new THREE.Vector3(-this.width * this.tileSize / 2, 0.1, zPos)); points.push(new THREE.Vector3(this.width * this.tileSize / 2, 0.1, zPos)); } const geometry = new THREE.BufferGeometry().setFromPoints(points); return new THREE.LineSegments(geometry, material); } worldToGridPosition(worldX, worldZ) { const gridX = Math.floor((worldX + (this.width * this.tileSize) / 2) / this.tileSize); const gridZ = Math.floor((worldZ + (this.height * this.tileSize) / 2) / this.tileSize); return { x: gridX, z: gridZ }; } gridToWorldPosition(gridX, gridZ) { const worldX = (gridX - this.width / 2 + 0.5) * this.tileSize; const worldZ = (gridZ - this.height / 2 + 0.5) * this.tileSize; return { x: worldX, z: worldZ }; } isTileOccupied(gridX, gridZ) { return this.occupiedPositions.has(`${gridX},${gridZ}`); } markTileOccupied(gridX, gridZ) { const key = `${gridX},${gridZ}`; if (!this.occupiedPositions.has(key)) { this.occupiedPositions.add(key); console.log(`Tile marked as occupied at grid position (${gridX}, ${gridZ})`); } } placeObstacle() { const randomX = Math.floor(Math.random() * this.width); const randomZ = Math.floor(Math.random() * this.height); const worldPos = this.gridToWorldPosition(randomX, randomZ); const obstacle = new Obstacle(new THREE.Vector3(worldPos.x, this.height / 2 + 0.05, worldPos.z)); this.mapMesh.add(obstacle.mesh); this.markTileOccupied(randomX, randomZ); return { x: randomX, z: randomZ }; } toggleNavMeshVisualization() { if (this.navMesh) { if (this.navMesh.visualElements.visible) { this.navMesh.visualElements.visible = false; } else { this.navMesh.visualElements.visible = true; } } } initNavMesh() { if (this.navMesh) { this.navMesh.dispose(); } this.navMesh = new NavMesh(this); console.log('NavMesh initialized after obstacle placement'); } placeObstacles(count) { const occupiedPositions = new Set(); for (let i = 0; i < count; i++) { let position; do { position = this.placeObstacle(); } while (occupiedPositions.has(`${position.x},${position.z}`)); occupiedPositions.add(`${position.x},${position.z}`); } } } class AStar { constructor(tileMap) { this.tileMap = tileMap; this.navMesh = tileMap.navMesh; this.pathVisual = new THREE.Group(); this.pathVisual.visible = false; // Initialize as invisible WorldScene.add(this.pathVisual); } findNearestNode(position) { let nearestNode = null; let minDistance = Infinity; for (const node of this.navMesh.points) { const distance = position.distanceTo(node); if (distance < minDistance) { minDistance = distance; nearestNode = node; } } return nearestNode; } heuristic(a, b) { return a.distanceTo(b); } getNeighbors(node) { const neighbors = []; const maxDistance = this.tileMap.tileSize * 1.25; for (const point of this.navMesh.points) { if (point !== node && node.distanceTo(point) <= maxDistance) { neighbors.push(point); } } return neighbors; } findPath(start, goal) { const startNode = this.findNearestNode(start); const goalNode = this.findNearestNode(goal); if (!startNode || !goalNode) return null; const openSet = new Set([startNode]); const closedSet = new Set(); const cameFrom = new Map(); const gScore = new Map(); const fScore = new Map(); gScore.set(startNode, 0); fScore.set(startNode, this.heuristic(startNode, goalNode)); while (openSet.size > 0) { let current = null; let lowestFScore = Infinity; for (const node of openSet) { const score = fScore.get(node) || Infinity; if (score < lowestFScore) { lowestFScore = score; current = node; } } if (current === goalNode) { return this.reconstructPath(cameFrom, current); } openSet.delete(current); closedSet.add(current); for (const neighbor of this.getNeighbors(current)) { if (closedSet.has(neighbor)) continue; const tentativeGScore = (gScore.get(current) || 0) + current.distanceTo(neighbor); if (!openSet.has(neighbor)) { openSet.add(neighbor); } else if (tentativeGScore >= (gScore.get(neighbor) || 0)) { continue; } cameFrom.set(neighbor, current); gScore.set(neighbor, tentativeGScore); fScore.set(neighbor, tentativeGScore + this.heuristic(neighbor, goalNode)); } } return null; } reconstructPath(cameFrom, current) { const path = [current]; while (cameFrom.has(current)) { current = cameFrom.get(current); path.unshift(current); } return path; } visualizePath(path) { // Clear previous visualization while (this.pathVisual.children.length > 0) { const child = this.pathVisual.children[0]; if (child.geometry) child.geometry.dispose(); if (child.material) child.material.dispose(); this.pathVisual.remove(child); } // Update visibility based on settings this.pathVisual.visible = APP_SETTINGS.controls.showEnemyPath; if (!path || path.length < 2) return; // Create line visualization const points = path.map(point => new THREE.Vector3(point.x, point.y + 1, point.z)); const geometry = new THREE.BufferGeometry().setFromPoints(points); const material = new THREE.LineBasicMaterial({ color: 0x00ff00, linewidth: 3 }); const line = new THREE.Line(geometry, material); this.pathVisual.add(line); // Add spheres at path points const sphereGeometry = new THREE.SphereGeometry(0.5, 8, 8); const sphereMaterial = new THREE.MeshBasicMaterial({ color: 0x00ff00 }); points.forEach(point => { const sphere = new THREE.Mesh(sphereGeometry, sphereMaterial); sphere.position.copy(point); this.pathVisual.add(sphere); }); } togglePathVisibility(visible) { this.pathVisual.visible = visible; } dispose() { while (this.pathVisual.children.length > 0) { const child = this.pathVisual.children[0]; if (child.geometry) child.geometry.dispose(); if (child.material) child.material.dispose(); this.pathVisual.remove(child); } WorldScene.remove(this.pathVisual); } } class NavMesh { constructor(tileMap) { this.tileMap = tileMap; this.points = []; this.visualElements = new THREE.Group(); this.visualElements.visible = APP_SETTINGS.controls.showNavMesh; this.pointSize = 1.5; this.pointColor = 0xff0000; this.lineColor = 0xffff00; console.log('Initializing NavMesh with TileMap dimensions:', `${this.tileMap.width}x${this.tileMap.height}`); this.generateGrid(); this.createVisualization(); WorldScene.add(this.visualElements); } isCornerOfOccupiedTile(gridX, gridZ) { // Check all four tiles that share this corner const tilesToCheck = [{ x: gridX - 1, z: gridZ - 1 }, { x: gridX - 1, z: gridZ }, { x: gridX, z: gridZ - 1 }, { x: gridX, z: gridZ }]; // If any of these tiles are occupied, this is a corner of an occupied tile return tilesToCheck.some(tile => tile.x >= 0 && tile.x < this.tileMap.width && tile.z >= 0 && tile.z < this.tileMap.height && this.tileMap.isTileOccupied(tile.x, tile.z) ); } generateGrid() { const tileSize = this.tileMap.tileSize; const width = this.tileMap.width; const height = this.tileMap.height; // Generate points at tile corners (intersections) for (let x = 0; x <= width; x++) { for (let z = 0; z <= height; z++) { if (!this.isCornerOfOccupiedTile(x, z)) { const xPos = (x - width / 2) * tileSize; const zPos = (z - height / 2) * tileSize; this.addPoint(xPos, zPos, 5); } } } // Generate points at tile centers (only for unoccupied tiles) for (let x = 0; x < width; x++) { for (let z = 0; z < height; z++) { if (!this.tileMap.isTileOccupied(x, z)) { const worldPos = this.tileMap.gridToWorldPosition(x, z); this.addPoint(worldPos.x, worldPos.z, 5); } } } } hasAdjacentOccupiedTile(x, z) { const adjacentTiles = [{ x: x - 1, z: z }, // Left { x: x + 1, z: z }, // Right { x: x, z: z - 1 }, // Front { x: x, z: z + 1 }, // Back { x: x - 1, z: z - 1 }, // Diagonal Front-Left { x: x + 1, z: z - 1 }, // Diagonal Front-Right { x: x - 1, z: z + 1 }, // Diagonal Back-Left { x: x + 1, z: z + 1 } // Diagonal Back-Right ]; return adjacentTiles.some(tile => tile.x >= 0 && tile.x < this.tileMap.width && tile.z >= 0 && tile.z < this.tileMap.height && this.tileMap.isTileOccupied(tile.x, tile.z) ); } addPoint(x, z, y) { const point = new THREE.Vector3(x, y, z); this.points.push(point); } createVisualization() { // Remove existing visualization this.removeVisualization(); // Create points visualization const pointGeometry = new THREE.SphereGeometry(this.pointSize, 8, 8); const pointMaterial = new THREE.MeshBasicMaterial({ color: this.pointColor }); this.points.forEach(point => { const pointMesh = new THREE.Mesh(pointGeometry, pointMaterial); pointMesh.position.copy(point); this.visualElements.add(pointMesh); }); // Log the number of points created console.log(`NavMesh: Created ${this.points.length} navigation points`); // Create lines between adjacent points const lineMaterial = new THREE.LineBasicMaterial({ color: this.lineColor, linewidth: 3 // Note: linewidth only works in WebGLRenderer with certain conditions }); const tileSize = this.tileMap.tileSize; for (let i = 0; i < this.points.length; i++) { for (let j = i + 1; j < this.points.length; j++) { const distance = this.points[i].distanceTo(this.points[j]); if (distance <= tileSize * 1.5) { // Connect points within reasonable distance const lineGeometry = new THREE.BufferGeometry().setFromPoints([ this.points[i], this.points[j] ]); const line = new THREE.Line(lineGeometry, lineMaterial); this.visualElements.add(line); } } } } removeVisualization() { while (this.visualElements.children.length > 0) { const child = this.visualElements.children[0]; if (child.geometry) child.geometry.dispose(); if (child.material) child.material.dispose(); this.visualElements.remove(child); } } dispose() { this.removeVisualization(); WorldScene.remove(this.visualElements); this.points = []; } } class Obstacle { constructor(position) { this.position = position; this.tileSize = APP_SETTINGS.tilemap.tileSize; this.height = APP_SETTINGS.obstacles.height; this.mesh = this.createMesh(); } createMesh() { const geometry = new THREE.BoxGeometry(this.tileSize, this.height, this.tileSize); const material = new THREE.MeshStandardMaterial({ color: APP_SETTINGS.obstacles.material.color, roughness: APP_SETTINGS.obstacles.material.roughness, metalness: APP_SETTINGS.obstacles.material.metalness }); const mesh = new THREE.Mesh(geometry, material); mesh.position.copy(this.position); mesh.castShadow = true; mesh.receiveShadow = true; return mesh; } } class TileMapGenerator { constructor(width = 10, height = 10) { this.width = width; this.height = height; this.tileSize = APP_SETTINGS.tilemap.tileSize; } generateMap() { const tileMap = new TileMap(this.width, this.height, this.tileSize); // Place obstacles first tileMap.placeObstacles(APP_SETTINGS.tilemap.obstacleCount); // Initialize NavMesh after obstacles are placed tileMap.initNavMesh(); return tileMap; } } 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.AudioPlayer = new AudioPlayer(); window.Textures = TextureManager(); window.Materials = MaterialManager(); window.Meshes = MeshManager(); window.Lights = LightingManager(); window.ModelLoader = new ModelLoader(); window.GameWorld = new World(); window.CameraControl = new CameraController(MainCamera); window.Player = new Player(MainCamera); window.Input = new InputHandler(); window.GunManager = new GunManager(WorldScene, MainCamera); // Only create enemy if enabled in settings if (APP_SETTINGS.controls.createEnemyOnStart) { window.Enemy = new Enemy(WorldScene); window.Enemy.loadModel().then(() => { console.log('Enemy initialized and loaded'); }); } // Load initial pistol window.GunManager.switchGun('pistol').then(() => { console.log('Initial smg loaded'); }); // Create crosshair window.Crosshair = new Crosshair(); // Wait for textures to load before creating UI elements this.waitForTexturesAndInitUI(); this.addEventListeners(); } waitForTexturesAndInitUI() { Promise.all([ Textures.loadTextures(), window.AudioPlayer.loadSoundAssets() ]).then(() => { if (Textures.texturesLoaded) { GameWorld.createTilemap(); 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) { if (GameWorld.skybox && GameWorld.skybox.shaderMaterial) { GameWorld.skybox.shaderMaterial.uniforms.iResolution.value.set(width, height); } 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(); // Update gun if one is equipped if (window.GunManager.getCurrentGun()) { const currentGun = window.GunManager.getCurrentGun(); currentGun.update(this.deltaTime); 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); } } class Crosshair { constructor() { this.element = document.createElement('div'); this.init(); } init() { // Create crosshair styles this.element.style.position = 'absolute'; this.element.style.left = '50%'; this.element.style.top = '50%'; this.element.style.width = '20px'; this.element.style.height = '20px'; this.element.style.transform = 'translate(-50%, -50%)'; this.element.style.pointerEvents = 'none'; // Create vertical line const vertical = document.createElement('div'); vertical.style.position = 'absolute'; vertical.style.width = '2px'; vertical.style.height = '100%'; vertical.style.backgroundColor = '#ff0000'; vertical.style.left = '50%'; vertical.style.transform = 'translateX(-50%)'; // Create horizontal line const horizontal = document.createElement('div'); horizontal.style.position = 'absolute'; horizontal.style.width = '100%'; horizontal.style.height = '2px'; horizontal.style.backgroundColor = '#ff0000'; horizontal.style.top = '50%'; horizontal.style.transform = 'translateY(-50%)'; // Add lines to crosshair this.element.appendChild(vertical); this.element.appendChild(horizontal); // Add crosshair to UI if (window.uiDiv) { window.uiDiv.appendChild(this.element); } else { console.error('UI div not found'); } } show() { this.element.style.display = 'block'; } hide() { this.element.style.display = 'none'; } setColor(color) { const lines = this.element.children; for (let line of lines) { line.style.backgroundColor = color; } } setSize(size) { this.element.style.width = `${size}px`; this.element.style.height = `${size}px`; } setThickness(thickness) { const lines = this.element.children; lines[0].style.width = `${thickness}px`; // vertical line lines[1].style.height = `${thickness}px`; // horizontal line } } class AudioPlayer { constructor() { this.listener = new THREE.AudioListener(); this.sounds = new Map(); this.audioLoader = new THREE.AudioLoader(LoadingManager); // Add listener to camera when it's available if (window.MainCamera) { window.MainCamera.add(this.listener); } } async loadSound(key, url, volume = 1) { return new Promise((resolve, reject) => { // Check if sound is already loaded if (this.sounds.has(key)) { resolve(this.sounds.get(key)); return; } this.audioLoader.load(url, (buffer) => { const sound = new THREE.Audio(this.listener); sound.setBuffer(buffer); sound.setVolume(volume); this.sounds.set(key, sound); console.log(`Loaded sound: ${key}`); resolve(sound); }, undefined, (error) => { console.error(`Error loading sound ${key}:`, error); reject(error); } ); }); } async loadSoundAssets() { const loadPromises = []; // Load all sound categories for (const category in SOUND_ASSETS) { for (const soundKey in SOUND_ASSETS[category]) { const sound = SOUND_ASSETS[category][soundKey]; loadPromises.push( this.loadSound(soundKey, sound.url, sound.volume) ); } } return Promise.all(loadPromises); } play(key) { const sound = this.sounds.get(key); if (sound) { if (sound.isPlaying) { sound.stop(); } sound.play(); } else { console.warn(`Sound ${key} not found`); } } stop(key) { const sound = this.sounds.get(key); if (sound && sound.isPlaying) { sound.stop(); } } stopAll() { this.sounds.forEach(sound => { if (sound.isPlaying) { sound.stop(); } }); } setVolume(key, volume) { const sound = this.sounds.get(key); if (sound) { sound.setVolume(Math.max(0, Math.min(1, volume))); } } dispose() { this.sounds.forEach(sound => { sound.stop(); if (sound.buffer) { sound.buffer.dispose(); } }); this.sounds.clear(); } } window.Game = new App(); Game.start();