import * as THREE from 'three'; import { Controls } from 'ControlManager'; import { VehicleManager } from 'VehicleManager'; import { GameManager } from 'GameManager'; import { CharacterManager } from 'CharacterManager'; import { GAME_CONFIG, TRACK_CONFIG, CAR_CONFIG } from 'config'; import { TrackGenerator } from 'TrackGenerator'; import { TRACK_DATA } from 'TrackData'; import React from 'react'; import ReactDOM from 'react-dom'; import { GameUI } from 'GameUI'; import { TrackGeneratorTool } from 'TrackGeneratorTool'; import { PropulsionEffectManager } from 'PropulsionEffect'; import { ExhaustEffectManager } from 'ExhaustEffect'; import { DebugVisualization } from 'DebugVisualization'; import { VisualEffectsManager } from 'VisualEffectsManager'; import { loadSupabase } from 'supabaseClient'; import { getModelFromCache } from 'ModelCache'; export class ThreeScene { constructor(mountRef, options = {}) { this.mountRef = mountRef; this.selectedCarId = options.selectedCarId || GAME_CONFIG.defaultCar; this.selectedTrackId = options.selectedTrackId || GAME_CONFIG.defaultTrack; this.selectedCharacterId = options.selectedCharacterId || 'Raven_Sentinel'; this.onMenuRequested = options.onMenuRequested || null; this.onCountdownUpdate = options.onCountdownUpdate; this.onSteeringUpdate = options.onSteeringUpdate || null; this.onRaceComplete = options.onRaceComplete || null; this.steeringSensitivity = options.steeringSensitivity; this.trackConfig = null; this.scene = null; this.camera = null; this.renderer = null; this.deviceType = this.detectDeviceType(); this.clock = new THREE.Clock(); this.animationFrameId = null; this.controls = null; this.vehicleManager = null; this.characterManager = null; this.gameManager = null; this.objects = []; this.trackGenerator = null; this.currentTrack = null; this.visualEffectsManager = null; this.propulsionEffectManager = null; this.exhaustEffectManager = null; this.debugVisualization = null; this.supabase = null; this.startPositions = []; if (this.checkWebGLSupport()) { this.init(); } else { this.showWebGLError(); } this.previousProjectionDistance = null; this.isMouseDown = false; this.previousMousePosition = { x: 0, y: 0 }; this.cameraYawOffset = 0; this.cameraPitchOffset = 0; this.opponentVehicleManagers = []; } checkWebGLSupport() { try { const canvas = document.createElement('canvas'); return !!( window.WebGLRenderingContext && (canvas.getContext('webgl') || canvas.getContext('experimental-webgl')) ); } catch (e) { return false; } } showWebGLError() { const errorMessage = document.createElement('div'); errorMessage.style.position = 'absolute'; errorMessage.style.top = '50%'; errorMessage.style.left = '50%'; errorMessage.style.transform = 'translate(-50%, -50%)'; errorMessage.style.textAlign = 'center'; errorMessage.style.color = 'white'; errorMessage.style.backgroundColor = 'rgba(0, 0, 0, 0.8)'; errorMessage.style.padding = '20px'; errorMessage.style.borderRadius = '10px'; errorMessage.style.fontFamily = 'Arial, sans-serif'; errorMessage.innerHTML = `

WebGL Not Supported

Sorry, your browser or device doesn't support WebGL.

Please try using a modern browser or updating your graphics drivers.

`; this.mountRef.appendChild(errorMessage); } async init() { this.setupScene(); this.setupCamera(); this.setupRenderer(); this.setupLights(); this.createFloor(); try { this.supabase = await loadSupabase(); if (!this.supabase) { console.warn("Supabase client failed to load during initialization."); } else { console.log("Supabase client loaded successfully in init."); } } catch (error) { console.error("Error loading Supabase in init:", error); } this.loadTrackConfig(); this.initializeGameComponents(); this.initVisualEffects(); this.initTrack(); this.initDebugVisualization(); this.adjustCameraForDevice(); window.addEventListener('resize', this.handleResize); this.renderer.domElement.addEventListener('mousedown', this.handleMouseDown); this.renderer.domElement.addEventListener('mouseup', this.handleMouseUp); this.renderer.domElement.addEventListener('mousemove', this.handleMouseMove); this.renderer.domElement.addEventListener('mouseleave', this.handleMouseUp); this.animate(); } setupScene() { this.scene = new THREE.Scene(); this.scene.background = new THREE.Color(0x000000); this.scene.fog = new THREE.Fog(0x000000, 100, 800); } setupCamera() { this.camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 3000 ); this.cameraHeight = GAME_CONFIG.camera.defaultHeight; const followDistance = GAME_CONFIG.camera.followDistance; this.camera.position.set(0, this.cameraHeight, -followDistance); this.camera.lookAt(0, 0, 0); this.defaultFOV = 75; this.currentFOV = this.defaultFOV; } setupRenderer() { try { const useAntialias = this.deviceType !== 'mobile'; this.renderer = new THREE.WebGLRenderer({ antialias: useAntialias, powerPreference: 'high-performance' }); this.renderer.setSize(window.innerWidth, window.innerHeight); const maxPixelRatio = this.deviceType === 'mobile' ? 2 : 3; const devicePixelRatio = Math.min(window.devicePixelRatio, maxPixelRatio); this.renderer.setPixelRatio(devicePixelRatio); this.mountRef.appendChild(this.renderer.domElement); } catch (error) { console.error('Error creating WebGL renderer:', error); this.showWebGLError(); throw new Error('Failed to create WebGL renderer'); } } setupLights() { const ambientLight = new THREE.AmbientLight(0xffffff, 0.5); this.scene.add(ambientLight); this.objects.push(ambientLight); const directionalLight = new THREE.DirectionalLight(0xffffff, 1); directionalLight.position.set(0, 10, 5); this.scene.add(directionalLight); this.objects.push(directionalLight); } initializeGameComponents() { this.vehicleManager = new VehicleManager(this.scene, this.selectedCarId); if (this.vehicleManager && this.steeringSensitivity !== undefined) { const baseVehicleSensitivity = this.vehicleManager.steeringSensitivity; const sensitivityFactor = this.steeringSensitivity / 50; this.vehicleManager.steeringSensitivity = baseVehicleSensitivity * sensitivityFactor; console.log(`Applied steering sensitivity from props: ${this.steeringSensitivity}%, factor: ${sensitivityFactor}`); } this.characterManager = new CharacterManager(this.scene); if (this.selectedCharacterId === 'Dolphine') { console.log('Initializing Dolphine character model'); const dolphineConfig = CAR_CONFIG['Dolphine']; if (dolphineConfig && dolphineConfig.modelUrl) { console.log(`Using Dolphine model: ${dolphineConfig.modelUrl}`); } } this.characterManager.selectCharacter(this.selectedCharacterId); this.gameManager = new GameManager(this.scene, { onRaceComplete: this.onRaceComplete }); this.gameManager.init(); this.gameManager.onCountdownUpdate = this.onCountdownUpdate; this.gameManager.scene = this; this.controls = new Controls(this); this.game = { controls: this.controls, visualEffectsManager: null }; if (this.vehicleManager && this.vehicleManager.getVehicle()) { const carConfig = CAR_CONFIG[this.selectedCarId] || {}; let propulsionOffsetsToUse; if (carConfig.propulsionEffects?.offsets) { propulsionOffsetsToUse = carConfig.propulsionEffects.offsets; console.log(`Using ${propulsionOffsetsToUse.length}-point propulsion config for ${this.selectedCarId}`); } else { const rearOffset = -1.8; const horizontalSpread = 0.4; propulsionOffsetsToUse = [ new THREE.Vector3(-horizontalSpread, -0.1, rearOffset), new THREE.Vector3(horizontalSpread, -0.1, rearOffset) ]; console.log(`Using default 2-point propulsion config for ${this.selectedCarId}`); } this.propulsionEffectManager = new PropulsionEffectManager({ vehicleRef: this.vehicleManager.getVehicle(), offsets: propulsionOffsetsToUse, carConfig: carConfig }); this.propulsionEffectManager.meshes.forEach(mesh => { this.scene.add(mesh); }); } else { console.error("VehicleManager or vehicle mesh not available for PropulsionEffectManager"); } if (this.vehicleManager && this.vehicleManager.getVehicle()) { const carConfig = CAR_CONFIG[this.selectedCarId] || {}; let exhaustOptions = {}; if (carConfig.exhaustEffects?.points) { exhaustOptions = { vehicleRef: this.vehicleManager.getVehicle(), points: carConfig.exhaustEffects.points, ...(carConfig.exhaustEffects || {}) }; console.log(`Using ${carConfig.exhaustEffects.points.length}-point exhaust config for ${this.selectedCarId}`); } else { const rearOffsetExhaust = -1.9; const horizontalSpreadExhaust = 0.5; const verticalOffsetExhaust = -0.2; const defaultExhaustOffsets = [ new THREE.Vector3(-horizontalSpreadExhaust, verticalOffsetExhaust, rearOffsetExhaust), new THREE.Vector3(horizontalSpreadExhaust, verticalOffsetExhaust, rearOffsetExhaust) ]; exhaustOptions = { vehicleRef: this.vehicleManager.getVehicle(), offsets: defaultExhaustOffsets }; console.log(`Using default 2-point exhaust config for ${this.selectedCarId}`); } this.exhaustEffectManager = new ExhaustEffectManager(exhaustOptions); this.exhaustEffectManager.meshes.forEach(mesh => { this.scene.add(mesh); }); } else { console.error("VehicleManager or vehicle mesh not available for ExhaustEffectManager"); } } initVisualEffects() { this.visualEffectsManager = new VisualEffectsManager(this.scene); } loadTrackConfig() { if (TRACK_CONFIG && TRACK_CONFIG[this.selectedTrackId]) { this.trackConfig = TRACK_CONFIG[this.selectedTrackId]; console.log(`Loaded track config for: ${this.trackConfig.name}`); this.applyTrackVisualEffects(); } else { console.warn(`Track config not found for: ${this.selectedTrackId}, using default`); } } initTrack() { this.trackGenerator = new TrackGenerator(this.scene); const trackData = TRACK_DATA[this.selectedTrackId]; this.trackGeneratorTool = new TrackGeneratorTool(this.scene, this.trackGenerator); if (trackData) { if (this.trackConfig && this.trackConfig.displayLength) { console.log(`Track length: ${this.trackConfig.displayLength}`); } this.currentTrack = this.trackGenerator.generateTrack(trackData); if (this.trackGeneratorTool) { this.trackGeneratorTool.createStartLine(trackData); this.trackGeneratorTool.createFinishLine(trackData); } this.startPositions = []; if (this.vehicleManager && trackData.points && trackData.points.length > 0) { const startLineT = trackData.startLine ? trackData.startLine.t : 0; const curve = this.trackGenerator.trackCurve; if (curve) { const centerPoint = curve.getPointAt(startLineT); const tangent = curve.getTangentAt(startLineT).normalize(); const normal = new THREE.Vector3(tangent.z, 0, -tangent.x).normalize(); const baseRotation = Math.atan2(tangent.x, tangent.z); const gridSpacingLateral = 3; const gridSpacingForward = -4; const offsets = [ { lateral: -0.5, forward: 0 }, { lateral: 0.5, forward: 0 }, { lateral: -0.5, forward: 1.0 }, { lateral: 0.5, forward: 1.0 } ]; offsets.forEach((offset, index) => { const lateralOffset = normal.clone().multiplyScalar(offset.lateral * gridSpacingLateral); const forwardOffset = tangent.clone().multiplyScalar(offset.forward * gridSpacingForward); const pos = centerPoint.clone() .add(lateralOffset) .add(forwardOffset); const gridPointOnCurve = this.trackGenerator.getClosestPointOnCurve(pos); pos.y = gridPointOnCurve.point.y + 0.5; this.startPositions.push({ position: pos.clone(), rotation: baseRotation }); console.log(`Calculated Start Position ${index + 1}:`, pos, `Rotation: ${baseRotation.toFixed(2)}`); const sphereGeo = new THREE.SphereGeometry(0.5, 16, 16); const sphereMat = new THREE.MeshBasicMaterial({ color: new THREE.Color().setHSL(index / offsets.length, 1.0, 0.5) }); const debugSphere = new THREE.Mesh(sphereGeo, sphereMat); debugSphere.position.copy(pos); this.scene.add(debugSphere); this.objects.push(debugSphere); }); if (this.startPositions.length > 0) { const randomIndex = Math.floor(Math.random() * this.startPositions.length); const playerStartPosition = this.startPositions[randomIndex]; console.log(`Player starting at random position index: ${randomIndex}`); this.vehicleManager.setVehiclePosition( playerStartPosition.position.x, playerStartPosition.position.y, playerStartPosition.position.z ); this.vehicleManager.setVehicleRotation(0, playerStartPosition.rotation || 0, 0); const cameraOffset = new THREE.Vector3(0, 2.4, -5.3); const rotatedOffset = cameraOffset.clone().applyAxisAngle(new THREE.Vector3(0, 1, 0), playerStartPosition.rotation); this.camera.position.copy(playerStartPosition.position).add(rotatedOffset); this.camera.lookAt(playerStartPosition.position); this.currentSteering = 0; this.targetVehicleRotation = playerStartPosition.rotation || 0; this.initialRotation = playerStartPosition.rotation || 0; this.updateVehiclePositionOnTrack(playerStartPosition.position); // this.addStaticOpponentVehicle(randomIndex); // Removed call to prevent static opponent spawning } else { console.error("Failed to calculate any start positions."); } } else { console.error("Track curve not available for calculating start positions."); } } } else { console.error(`Track data not found for: ${this.selectedTrackId}`); } } addStaticOpponentVehicle(playerStartIndex) { // Only add a static opponent if it's NOT a multiplayer game if (this.gameManager && this.gameManager.isMultiplayer) { console.log("Multiplayer mode detected, skipping static opponent creation."); return; } // List of available vehicle model IDs (excluding characters like Dolphine, APE, etc.) const vehicleModelIds = [ 'DRILL', 'DARIO', 'COMET', 'Apophis', 'ION-', 'LUCIA', 'NOODLES', 'ROCKET', 'DELL2', 'GHOST', 'GRINDER', 'Monture', 'GEAR', 'PAULLETET', 'TOOL', 'NOSHIBU', 'LOCKHEED', 'APE2', 'GRINDER2', 'GHOST2', 'GEAR2' // Assuming these are vehicles too ]; if (vehicleModelIds.length === 0 || this.startPositions.length <= 1) { console.warn("Not enough vehicle models or start positions to add an opponent."); return; } // Find an available start position index (not the player's) let opponentIndex = -1; const availableIndices = this.startPositions .map((_, i) => i) .filter(i => i !== playerStartIndex); if (availableIndices.length > 0) { opponentIndex = availableIndices[Math.floor(Math.random() * availableIndices.length)]; } else { console.warn("No available start positions left for opponent."); return; } const opponentStartPosition = this.startPositions[opponentIndex]; // Select a random vehicle model ID const randomModelId = vehicleModelIds[Math.floor(Math.random() * vehicleModelIds.length)]; console.log(`Creating opponent VehicleManager with model: ${randomModelId} and player config: ${this.selectedCarId} at index ${opponentIndex}`); // --- Create Opponent Vehicle Manager --- // Pass player's selectedCarId as the third argument for configuration const opponentVehicleManager = new VehicleManager(this.scene, randomModelId, this.selectedCarId); this.opponentVehicleManagers.push(opponentVehicleManager); // Store the manager // --- Set Initial Position and Rotation --- opponentVehicleManager.setVehiclePosition( opponentStartPosition.position.x, opponentStartPosition.position.y, opponentStartPosition.position.z ); opponentVehicleManager.setVehicleRotation(0, opponentStartPosition.rotation || 0, 0); // Make sure the vehicle mesh is loaded before creating effects const opponentVehicleMesh = opponentVehicleManager.getVehicle(); if (!opponentVehicleMesh) { console.error(`Failed to get vehicle mesh for opponent ${randomModelId}. Effects cannot be created.`); // Clean up the partially created manager if the mesh failed opponentVehicleManager.dispose(); this.opponentVehicleManagers.pop(); // Remove from list return; // Stop processing this opponent } // Ensure materials are correctly set up (handle potential issues) opponentVehicleMesh.traverse((child) => { if (child.isMesh) { child.castShadow = true; // Optional: Enable shadows child.receiveShadow = true; // Optional: Receive shadows } }); // --- Create Effects for Opponent Vehicle (Using the manager's vehicle) --- const opponentCarConfig = CAR_CONFIG[randomModelId] || {}; let opponentPropulsionManager = null; let opponentExhaustManager = null; // Propulsion Effects let opponentPropulsionOffsets; if (opponentCarConfig.propulsionEffects?.offsets) { opponentPropulsionOffsets = opponentCarConfig.propulsionEffects.offsets; } else { const rearOffset = -1.8; const horizontalSpread = 0.4; opponentPropulsionOffsets = [ new THREE.Vector3(-horizontalSpread, -0.1, rearOffset), new THREE.Vector3(horizontalSpread, -0.1, rearOffset) ]; } opponentPropulsionManager = new PropulsionEffectManager({ vehicleRef: opponentVehicleMesh, // Use the mesh from the manager offsets: opponentPropulsionOffsets, carConfig: opponentCarConfig, }); opponentPropulsionManager.meshes.forEach(mesh => this.scene.add(mesh)); // Exhaust Effects let opponentExhaustOptions = {}; if (opponentCarConfig.exhaustEffects?.points) { opponentExhaustOptions = { vehicleRef: opponentVehicleMesh, // Use the mesh from the manager points: opponentCarConfig.exhaustEffects.points, ...(opponentCarConfig.exhaustEffects || {}) }; } else { const rearOffsetExhaust = -1.9; const horizontalSpreadExhaust = 0.5; const verticalOffsetExhaust = -0.2; const defaultExhaustOffsets = [ new THREE.Vector3(-horizontalSpreadExhaust, verticalOffsetExhaust, rearOffsetExhaust), new THREE.Vector3(horizontalSpreadExhaust, verticalOffsetExhaust, rearOffsetExhaust) ]; opponentExhaustOptions = { vehicleRef: opponentVehicleMesh, // Use the mesh from the manager offsets: defaultExhaustOffsets }; } opponentExhaustManager = new ExhaustEffectManager(opponentExhaustOptions); opponentExhaustManager.meshes.forEach(mesh => this.scene.add(mesh)); // Store opponent effect managers (link to the vehicle manager or ID) if (!this.opponentEffectManagers) this.opponentEffectManagers = []; // Store manager references along with the vehicle ID for potential future use this.opponentEffectManagers.push({ vehicleManager: opponentVehicleManager, // Reference the manager itself propulsion: opponentPropulsionManager, exhaust: opponentExhaustManager, vehicleId: randomModelId }); console.log(`Successfully created VehicleManager and effects for opponent ${randomModelId}`); // --- End Effects Creation --- // NOTE: No need to add opponentVehicleMesh to this.scene or this.objects, // VehicleManager handles adding its mesh to the scene. } initDebugVisualization() { if (this.scene && this.camera && this.vehicleManager && this.trackGenerator) { this.debugVisualization = new DebugVisualization( this.scene, this.camera, this.vehicleManager, this.trackGenerator ); } else { console.warn('Cannot initialize DebugVisualization: Missing required managers.'); } } applyTrackVisualEffects() { if (this.selectedTrackId === 'NeonspireCircuit') { const fogColor = new THREE.Color(0x120030); this.scene.fog = new THREE.FogExp2(fogColor, 0.0020); this.scene.background = new THREE.Color(0x080018); if (this.scene) { this.scene.children.forEach(child => { if (child.isLight) { this.scene.remove(child); } }); const ambientLight = new THREE.AmbientLight(0x220033, 0.4); this.scene.add(ambientLight); this.objects.push(ambientLight); const pinkLight = new THREE.DirectionalLight(0xff00ff, 0.7); pinkLight.position.set(5, 15, 10); this.scene.add(pinkLight); this.objects.push(pinkLight); const cyanLight = new THREE.DirectionalLight(0x00ffff, 0.7); cyanLight.position.set(-10, 20, -5); this.scene.add(cyanLight); this.objects.push(cyanLight); } } else { this.scene.fog = new THREE.Fog(0x000000, 100, 800); this.scene.background = new THREE.Color(0x000000); const ambientLight = new THREE.AmbientLight(0xffffff, 0.5); this.scene.add(ambientLight); this.objects.push(ambientLight); const directionalLight = new THREE.DirectionalLight(0xffffff, 1); directionalLight.position.set(0, 10, 5); this.scene.add(directionalLight); this.objects.push(directionalLight); } } handleResize = () => { if (!this.camera || !this.renderer) return; this.deviceType = this.detectDeviceType(); this.camera.aspect = window.innerWidth / window.innerHeight; this.camera.updateProjectionMatrix(); this.renderer.setSize(window.innerWidth, window.innerHeight); if (this.deviceType === 'mobile') { const maxPixelRatio = 2; this.renderer.setPixelRatio(Math.min(window.devicePixelRatio, maxPixelRatio)); } else { const maxPixelRatio = 3; this.renderer.setPixelRatio(Math.min(window.devicePixelRatio, maxPixelRatio)); } this.adjustCameraForDevice(); }; adjustCameraForDevice() { if (!this.camera) return; if (this.deviceType === 'mobile') { this.defaultFOV = 80; this.currentFOV = this.defaultFOV; this.camera.fov = this.defaultFOV; this.cameraHeight = GAME_CONFIG.camera.defaultHeight * 0.9; } else if (this.deviceType === 'tablet') { this.defaultFOV = 70; this.currentFOV = this.defaultFOV; this.camera.fov = this.defaultFOV; this.cameraHeight = GAME_CONFIG.camera.defaultHeight * 0.85; } else { this.defaultFOV = 68; this.currentFOV = this.defaultFOV; this.camera.fov = this.defaultFOV; this.cameraHeight = GAME_CONFIG.camera.defaultHeight * 0.8; } this.camera.updateProjectionMatrix(); } updateVehicle(deltaTime) { this.controls.update(deltaTime); const vehiclePosition = this.vehicleManager.getVehiclePosition(); const vehicle = this.vehicleManager.getVehicle(); const speed = this.vehicleManager.getSpeed(); const steering = this.vehicleManager.getSteering(); this.currentSteering = steering; if (vehicle && Math.abs(speed) > 0.01) { const currentRotation = vehicle.rotation.y; const normalizedSpeed = Math.abs(speed) / this.vehicleManager.getMaxSpeed(); const speedFactor = Math.min(1, normalizedSpeed * 4); const steeringAngle = this.vehicleManager.steeringAngle; const rotationDelta = steering * steeringAngle * speedFactor * deltaTime; this.targetVehicleRotation = currentRotation + rotationDelta; } const vehicleRotation = this.targetVehicleRotation || 0; if (this.trackGenerator && this.trackGenerator.trackCurve) { const vehicleVector = new THREE.Vector3(vehiclePosition.x, vehiclePosition.y, vehiclePosition.z); const closestPoint = this.trackGenerator.getClosestPointOnCurve(vehicleVector); const maxTrackDistance = this.trackGenerator.trackData.trackWidth / 1.5; if (closestPoint.distance > maxTrackDistance) { const dirToTrack = new THREE.Vector3().subVectors( closestPoint.point, vehicleVector ).normalize(); const correctionFactor = 0.2 * (closestPoint.distance / maxTrackDistance); vehiclePosition.x += dirToTrack.x * correctionFactor * Math.abs(speed); vehiclePosition.z += dirToTrack.z * correctionFactor * Math.abs(speed); vehiclePosition.y = closestPoint.point.y + 0.5; } else { vehiclePosition.y = closestPoint.point.y + 0.5; } this.vehicleManager.setVehiclePosition(vehiclePosition.x, vehiclePosition.y, vehiclePosition.z); } if (vehicle) { this.vehicleManager.setVehicleRotation(0, vehicleRotation); const hoverFrequency = 2.5; const hoverAmplitude = 0.08; const hoverHeight = hoverAmplitude + Math.sin(this.clock.elapsedTime * hoverFrequency) * (hoverAmplitude * 0.5); vehicle.position.y = vehiclePosition.y + hoverHeight; } const maxCameraTilt = 10; const cameraTiltSpeed = 3.0; const smoothTilt = this.currentSteering || 0; const vehicleSpeedMPH = this.vehicleManager.getSpeedMPH(); const maxSpeedMPH = this.vehicleManager.getMaxSpeedMPH(); const speedFactor = Math.min(Math.abs(vehicleSpeedMPH) / maxSpeedMPH, 1); const tiltSpeedAdjustment = 1 - (speedFactor * 0.3); const targetCameraTilt = smoothTilt * maxCameraTilt * speedFactor * tiltSpeedAdjustment; this.currentCameraTilt = this.currentCameraTilt || 0; this.currentCameraTilt += (targetCameraTilt - this.currentCameraTilt) * cameraTiltSpeed * deltaTime; const cameraHeightMultiplier = 0.8; const adjustedCameraHeight = this.cameraHeight * cameraHeightMultiplier; const followDistance = GAME_CONFIG.camera.followDistance * 0.7; let heightAdjustment = 0; if (this.trackGenerator && this.trackGenerator.trackCurve) { const vehiclePosition = this.vehicleManager.getVehiclePosition(); const vehicleVector = new THREE.Vector3(vehiclePosition.x, vehiclePosition.y, vehiclePosition.z); const closestPoint = this.trackGenerator.getClosestPointOnCurve(vehicleVector); heightAdjustment = closestPoint.point.y - vehiclePosition.y; const lookAheadT = Math.min(1, closestPoint.t + 0.05); const upcomingPoint = this.trackGenerator.trackCurve.getPointAt(lookAheadT); const upcomingElevation = upcomingPoint.y - vehiclePosition.y; heightAdjustment = Math.max(heightAdjustment, upcomingElevation); } const vehicleObj = this.vehicleManager.getVehicle(); const vehicleDirection = vehicleObj ? vehicleObj.rotation.y : 0; const currentSteering = this.vehicleManager.getSteering(); const steeringFactor = Math.abs(currentSteering) * 0.5; const cameraFixedHeight = this.cameraHeight * (0.7 - steeringFactor * 0.1); const cameraFixedDistance = 3.7 + steeringFactor * 1.5; const steeringAmount = this.vehicleManager.getSteering(); const maxShift = 1.2; const steeringCurve = Math.pow(Math.abs(steeringAmount), 2.0); const speedBasedShift = Math.min(1, vehicleSpeedMPH / 100) * 0.3 + 0.7; const shiftFactor = steeringCurve * maxShift * speedBasedShift; const lagFactor = 0.08; this.cameraOffset = this.cameraOffset || new THREE.Vector3(); const targetOffsetX = -Math.sin(vehicleDirection) * cameraFixedDistance + Math.cos(vehicleDirection) * shiftFactor * Math.sign(steeringAmount); const targetOffsetZ = -Math.cos(vehicleDirection) * cameraFixedDistance - Math.sin(vehicleDirection) * shiftFactor * Math.sign(steeringAmount); this.cameraOffset.x += (targetOffsetX - this.cameraOffset.x) * lagFactor; this.cameraOffset.z += (targetOffsetZ - this.cameraOffset.z) * lagFactor; const updatedVehiclePosition = this.vehicleManager.getVehiclePosition(); this.previousCameraPosition = this.previousCameraPosition || new THREE.Vector3( updatedVehiclePosition.x + this.cameraOffset.x, updatedVehiclePosition.y + cameraFixedHeight, updatedVehiclePosition.z + this.cameraOffset.z ); const targetCameraPosition = new THREE.Vector3( updatedVehiclePosition.x + this.cameraOffset.x, updatedVehiclePosition.y + cameraFixedHeight, updatedVehiclePosition.z + this.cameraOffset.z ); this.cameraVerticalVelocity = this.cameraVerticalVelocity || 0; this.previousVehicleHeight = this.previousVehicleHeight || updatedVehiclePosition.y; const heightDelta = updatedVehiclePosition.y - this.previousVehicleHeight; this.previousVehicleHeight = updatedVehiclePosition.y; const heightChangeThreshold = 0.05; const springStrength = 2.0; const dampingFactor = 0.85; if (Math.abs(heightDelta) > heightChangeThreshold) { this.cameraVerticalVelocity = this.cameraVerticalVelocity * dampingFactor + heightDelta * (1.0 - dampingFactor); } else { this.cameraVerticalVelocity *= 0.9; } const verticalOffset = -this.cameraVerticalVelocity * springStrength; targetCameraPosition.y += verticalOffset; const normalizedSpeed = Math.abs(this.vehicleManager.getSpeed()) / this.vehicleManager.getMaxSpeed(); const cameraDistance = 5.375; const lookAheadDistance = 4.0; const steeringForCamera = this.vehicleManager.getSteering(); const maxCameraShiftAngle = 15; const cameraShiftSpeed = 3.5; this.currentCameraShiftAngle = this.currentCameraShiftAngle || 0; const targetCameraShiftAngle = steeringForCamera * maxCameraShiftAngle * speedFactor; this.currentCameraShiftAngle += (targetCameraShiftAngle - this.currentCameraShiftAngle) * cameraShiftSpeed * deltaTime; const cameraShiftRadians = THREE.MathUtils.degToRad(this.currentCameraShiftAngle); const lateralShiftDistance = 0.8; const lateralShift = Math.sin(cameraShiftRadians) * lateralShiftDistance; const closerCameraDistance = 5.375; const shiftedCameraDistance = closerCameraDistance * Math.cos(cameraShiftRadians); const cameraX = vehiclePosition.x - Math.sin(vehicleDirection) * shiftedCameraDistance + Math.cos(vehicleDirection) * lateralShift; const cameraZ = vehiclePosition.z - Math.cos(vehicleDirection) * shiftedCameraDistance - Math.sin(vehicleDirection) * lateralShift; const cameraY = vehiclePosition.y + this.cameraHeight * 0.8; const verticalShiftAmount = 0.3; const verticalShift = Math.abs(this.currentCameraShiftAngle) / maxCameraShiftAngle * verticalShiftAmount; const baseCameraPosition = new THREE.Vector3(cameraX, cameraY + verticalShift, cameraZ); const relativeCamPos = new THREE.Vector3().subVectors(baseCameraPosition, updatedVehiclePosition); const offsetQuaternion = new THREE.Quaternion().setFromEuler( new THREE.Euler(this.cameraPitchOffset, this.cameraYawOffset, 0, 'YXZ') ); relativeCamPos.applyQuaternion(offsetQuaternion); const finalCameraPosition = new THREE.Vector3().copy(updatedVehiclePosition).add(relativeCamPos); this.camera.position.copy(finalCameraPosition); const lookAheadReduction = Math.abs(this.currentCameraShiftAngle) / maxCameraShiftAngle * 0.3; const adjustedLookAheadDistance = 4.0 * (1 - lookAheadReduction); const lookAtX = vehiclePosition.x + Math.sin(vehicleDirection) * adjustedLookAheadDistance; const lookAtZ = vehiclePosition.z + Math.cos(vehicleDirection) * adjustedLookAheadDistance; const lookAtY = vehiclePosition.y + 0.8; this.camera.lookAt(updatedVehiclePosition.x, lookAtY, updatedVehiclePosition.z); } animate = () => { const deltaTime = this.clock.getDelta(); // Check if game is paused via gameManager if (this.gameManager && this.gameManager.isPaused) { // Only render the scene when paused, don't update game state this.renderer.render(this.scene, this.camera); this.animationFrameId = requestAnimationFrame(this.animate); return; } // Run animation callbacks if any exist if (this.scene.userData.animateCallbacks) { this.scene.userData.animateCallbacks.forEach(callback => callback(deltaTime)); } // No drag or friction is applied in the animate method // Completely removed all speed reduction code to ensure speed is never reduced during gameplay this.updateVehicle(deltaTime); // --- NaN Safeguard after updateVehicle --- const currentVehiclePos = this.vehicleManager?.getVehiclePosition(); if (!currentVehiclePos || !Number.isFinite(currentVehiclePos.x) || !Number.isFinite(currentVehiclePos.z)) { console.error(`NaN detected in vehicle position immediately after updateVehicle. Pos:`, currentVehiclePos, `Skipping rest of frame updates.`); // Request next frame but skip updates for this frame this.animationFrameId = requestAnimationFrame(this.animate); return; } // --- End NaN Safeguard --- // Send raw steering input back to App via callback if (this.controls && this.onSteeringUpdate) { this.onSteeringUpdate(this.controls.currentSteering); } this.updateCharacter(deltaTime); this.updateInfiniteGrid(); this.updateVisualEffects(); this.checkTrackBoundaries(); // This should now receive valid position data this.updateDynamicFOV(deltaTime); // Update AI Manager - Removed // if (this.aiManager) { // this.aiManager.update(deltaTime); // } // Update track-specific effects if (this.selectedTrackId === 'QuantumValley') { this.updateQuantumValleyEffects(deltaTime); } else if (this.selectedTrackId === 'NeonspireCircuit') { this.updateNeonspireEffects(deltaTime); } // Update track generator tool for start line animations if (this.trackGeneratorTool) { this.trackGeneratorTool.update(deltaTime); } // Update Propulsion Effect if (this.propulsionEffectManager && this.vehicleManager) { const speed = this.vehicleManager.getSpeed(); const isBoosting = this.controls ? this.controls.boosting : false; // Get boost status this.propulsionEffectManager.update(deltaTime, this.clock.elapsedTime, speed, isBoosting); } // Update Exhaust Effect if (this.exhaustEffectManager && this.vehicleManager) { const speed = this.vehicleManager.getSpeed(); // Get boost status reliably using the getter from ControlManager const boostData = this.controls ? this.controls.getBoostData() : { active: false }; const isBoosting = boostData.active; this.exhaustEffectManager.update(deltaTime, this.clock.elapsedTime, speed, isBoosting); } if (this.gameManager && this.gameManager.initialized) { this.gameManager.update(deltaTime); } // Update Debug Visualization if (this.debugVisualization) { this.debugVisualization.update(deltaTime); } // Update Opponent Effects if (this.opponentEffectManagers) { this.opponentEffectManagers.forEach(managers => { const elapsedTime = this.clock.elapsedTime; // Get speed/boost status from the VehicleManager instance const speed = managers.vehicleManager ? managers.vehicleManager.getSpeed() : 0; // Assuming opponent boost status might be tracked differently or not at all yet const isBoosting = false; // Placeholder if (managers.propulsion) { managers.propulsion.update(deltaTime, elapsedTime, speed, isBoosting); } if (managers.exhaust) { managers.exhaust.update(deltaTime, elapsedTime, speed, isBoosting); } }); } this.renderer.render(this.scene, this.camera); this.animationFrameId = requestAnimationFrame(this.animate); }; // Added missing semicolon for arrow function property updateCharacter(deltaTime) { if (this.characterManager && this.vehicleManager && this.camera) { const vehiclePosition = this.vehicleManager.getVehiclePosition(); // Get steering value directly from controls for more responsive character tilting // This ensures we get the immediate steering input rather than the smoothed vehicle steering const steering = this.controls ? this.controls.currentSteering : this.vehicleManager.getSteering(); // Only update character when camera is available if (this.camera) { this.characterManager.updateCharacterPosition(this.camera, steering); // Debug logging for Dolphine character during the first 5 seconds if (this.selectedCharacterId === 'Dolphine' && this.clock.elapsedTime < 5) { const character = this.characterManager.getCharacter(); if (character) { console.log('Dolphine character position:', character.position); } } } } } updateDynamicFOV(deltaTime) { if (!this.vehicleManager) return; // Get current speed and calculate normalized speed (0-1) using MPH values const speedMPH = this.vehicleManager.getSpeedMPH(); const maxSpeedMPH = this.vehicleManager.getMaxSpeedMPH(); const normalizedSpeed = Math.min(1, Math.abs(speedMPH) / maxSpeedMPH); // Adjust FOV ranges based on device type let minFOV, maxFOV; if (this.deviceType === 'mobile') { // Mobile - slightly tighter FOV range for closer feeling minFOV = 65; maxFOV = 80; } else if (this.deviceType === 'tablet') { // Tablet - intermediate FOV range minFOV = 63; maxFOV = 78; } else { // Desktop - narrower FOV range for racing focus minFOV = 60; maxFOV = 75; } // Calculate target FOV - narrow FOV at high speeds to enhance sense of speed const targetFOV = minFOV + (maxFOV - minFOV) * normalizedSpeed; // Apply smooth transition to FOV change // Faster transition when accelerating, slower when decelerating const currentSpeedMPH = this.vehicleManager.getSpeedMPH(); const transitionSpeed = speedMPH > currentSpeedMPH ? 0.03 : 0.05; this.currentFOV += (targetFOV - this.currentFOV) * transitionSpeed; // Apply the FOV change to camera if (this.camera && Math.abs(this.camera.fov - this.currentFOV) > 0.01) { this.camera.fov = this.currentFOV; this.camera.updateProjectionMatrix(); } } updateVisualEffects() { // Update visual effects based on camera position and current scene state if (this.visualEffectsManager && this.gridSegments && this.gridSegments.length > 0) { // Pass gridSegments and camera position to visualEffectsManager this.visualEffectsManager.updateGridVisibility(this.gridSegments, this.camera.position); } } updateInfiniteGrid() { if (!this.gridSegments || !this.vehicleManager) return; const vehiclePosition = this.vehicleManager.getVehiclePosition(); const gridSize = 200; // Check each grid segment and reposition if necessary this.gridSegments.forEach(segment => { const dx = vehiclePosition.x - segment.position.x; const dz = vehiclePosition.z - segment.position.z; // Check if we need to reposition this grid segment // Use a larger threshold to reduce frequency of grid changes // This creates smoother transitions when traveling at high speeds if (Math.abs(dx) > gridSize * 2.5 || Math.abs(dz) > gridSize * 2.5) { // Calculate new grid position based on vehicle's current position // This creates a grid that always surrounds the vehicle const gridX = Math.round(vehiclePosition.x / gridSize) * gridSize; const gridZ = Math.round(vehiclePosition.z / gridSize) * gridSize; // Find the nearest available grid position around the vehicle // that isn't already occupied by another grid segment let newX = gridX; let newZ = gridZ; // Find positions in a spiral pattern around the vehicle // Expanded search radius to 3 for greater coverage const positions = []; for (let r = 0; r <= 3; r++) { for (let i = -r; i <= r; i++) { for (let j = -r; j <= r; j++) { // Skip positions that aren't on the edge of the spiral if (r > 0 && Math.abs(i) < r && Math.abs(j) < r) continue; positions.push({ x: gridX + i * gridSize, z: gridZ + j * gridSize }); } } } // Find the first position that's not occupied let found = false; for (const pos of positions) { if (!this.isGridPositionOccupied(pos.x, pos.z, segment)) { newX = pos.x; newZ = pos.z; found = true; break; } } if (found) { // Enhanced transitions with improved visual effects const prevOpacity = segment.material.opacity; segment.material.opacity = 0; segment.position.set(newX, 0.1, newZ); // More refined fade-in animation const fadeIn = () => { if (segment.material.opacity < prevOpacity) { segment.material.opacity += 0.03; requestAnimationFrame(fadeIn); } }; fadeIn(); } } }); } isGridPositionOccupied(x, z, excludeSegment) { return this.gridSegments.some(segment => segment !== excludeSegment && Math.abs(segment.position.x - x) < 10 && Math.abs(segment.position.z - z) < 10 ); } createFloor() { this.gridSegments = []; const gridSize = 300; const gridCount = 16; for (let x = -2; x <= 1; x++) { for (let z = -2; z <= 1; z++) { const grid = new THREE.GridHelper(gridSize, 60, 0x00aaff, 0x004488); grid.material.transparent = true; grid.material.opacity = 0.5; grid.material.blending = THREE.AdditiveBlending; grid.position.set(x * gridSize, 0.1, z * gridSize); this.scene.add(grid); this.gridSegments.push(grid); this.objects.push(grid); } } } disposeObject(object) { if (!object) return; if (object.geometry) { object.geometry.dispose(); } if (object.material) { if (Array.isArray(object.material)) { object.material.forEach(material => material.dispose()); } else { object.material.dispose(); } } } updateNeonspireEffects(deltaTime) { if (this.vehicleManager && this.scene.fog) { const position = this.vehicleManager.getVehiclePosition(); let fogDensity = 0.0020 + Math.sin(this.clock.elapsedTime * 0.5) * 0.0004; fogDensity = Math.max(0.0015, Math.min(0.0025, fogDensity)); if (this.scene.fog.isFogExp2) { this.scene.fog.density = fogDensity; } const fogColor = new THREE.Color(); const baseColor = new THREE.Color(0x120030); const accentColor = new THREE.Color(0x220060); const colorPulse = (Math.sin(this.clock.elapsedTime * 0.3) + 1) * 0.5; fogColor.lerpColors(baseColor, accentColor, colorPulse); this.scene.fog.color.copy(fogColor); this.scene.background.copy(new THREE.Color().lerpColors( new THREE.Color(0x080018), new THREE.Color(0x100030), colorPulse )); } } updateQuantumValleyEffects(deltaTime) { if (this.vehicleManager && this.scene.fog) { const position = this.vehicleManager.getVehiclePosition(); let fogDensity = 0.0015 + Math.sin(this.clock.elapsedTime * 0.3) * 0.0006; fogDensity = Math.max(0.001, Math.min(0.003, fogDensity)); if (this.scene.fog instanceof THREE.FogExp2) { this.scene.fog.density = fogDensity; } else { this.scene.fog = new THREE.FogExp2(0x001050, fogDensity); } const fogColor = new THREE.Color(); const baseColor = new THREE.Color(0x001050); const accentColor = new THREE.Color(0x0080a0); const colorPulse = (Math.sin(this.clock.elapsedTime * 0.2) + 1) * 0.5; fogColor.lerpColors(baseColor, accentColor, colorPulse); this.scene.fog.color.copy(fogColor); this.scene.background.copy(new THREE.Color().lerpColors( new THREE.Color(0x000520), new THREE.Color(0x001040), colorPulse )); this.scene.children.forEach(child => { if (child.isAmbientLight) { child.color.lerpColors( new THREE.Color(0x2040ff), new THREE.Color(0x00ffff), colorPulse ); } }); } } disposeGameComponents() { if (this.controls) { this.controls.dispose(); this.controls = null; } if (this.vehicleManager) { this.vehicleManager.dispose(); this.vehicleManager = null; } } disposeRenderer() { if (this.renderer && this.mountRef && this.mountRef.contains(this.renderer.domElement)) { this.mountRef.removeChild(this.renderer.domElement); this.renderer.dispose(); this.renderer = null; } } checkTrackBoundaries() { if (!this.trackGenerator || !this.vehicleManager) return; const vehiclePos = this.vehicleManager.getVehiclePosition(); if (!vehiclePos || !Number.isFinite(vehiclePos.x) || !Number.isFinite(vehiclePos.y) || !Number.isFinite(vehiclePos.z)) { console.error("Invalid vehiclePos received from VehicleManager:", vehiclePos); return; } const vehiclePosition = new THREE.Vector3( vehiclePos.x, vehiclePos.y, vehiclePos.z ); if (!vehiclePosition) return; const closestPoint = this.trackGenerator.getClosestPointOnCurve(vehiclePosition); if (!closestPoint || !closestPoint.point || !Number.isFinite(closestPoint.point.x) || !Number.isFinite(closestPoint.point.y) || !Number.isFinite(closestPoint.point.z) || !Number.isFinite(closestPoint.distance) || !Number.isFinite(closestPoint.t)) { console.error("Invalid closestPoint received from TrackGenerator:", closestPoint); return; } const maxTrackDistance = this.trackGenerator.trackData.trackWidth * 0.5; const vehicleSpeed = this.vehicleManager.getSpeed(); const speedMPH = this.vehicleManager.getSpeedMPH(); const maxSpeedMPH = this.vehicleManager.getMaxSpeedMPH(); const normalizedSpeed = Math.min(1, Math.abs(speedMPH) / maxSpeedMPH); if (closestPoint.distance > maxTrackDistance) { const penetration = closestPoint.distance - maxTrackDistance; if (!Number.isFinite(closestPoint.point.x) || !Number.isFinite(closestPoint.point.y) || !Number.isFinite(closestPoint.point.z) || !Number.isFinite(vehiclePosition.x) || !Number.isFinite(vehiclePosition.y) || !Number.isFinite(vehiclePosition.z)) { console.error("Invalid point data before calculating rawInwardDirection:", { closestPoint: closestPoint.point, vehiclePosition }); return; } const rawInwardDirection = new THREE.Vector3().subVectors(closestPoint.point, vehiclePosition); if (rawInwardDirection.lengthSq() < 0.0001) { console.warn("Skipping forcefield correction: rawInwardDirection length is too small."); } else { const inwardDirection = rawInwardDirection.normalize(); if (!Number.isFinite(inwardDirection.x) || !Number.isFinite(inwardDirection.y) || !Number.isFinite(inwardDirection.z)) { console.warn("Invalid inwardDirection after normalization:", inwardDirection); return; } const forceStrength = 0.8; const correctionMagnitude = penetration * forceStrength; if (!Number.isFinite(correctionMagnitude)) { console.warn("Invalid correctionMagnitude calculated:", { penetration, forceStrength }); return; } const correctionX = inwardDirection.x * correctionMagnitude; const correctionZ = inwardDirection.z * correctionMagnitude; if (!Number.isFinite(vehiclePos.x) || !Number.isFinite(vehiclePos.z) || !Number.isFinite(correctionX) || !Number.isFinite(correctionZ)) { console.error("Invalid values before calculating final corrected position:", { vehiclePos, correctionX, correctionZ }); return; } const correctedX = vehiclePos.x + correctionX; const correctedY = vehiclePos.y; const correctedZ = vehiclePos.z + correctionZ; if (Number.isFinite(correctedX) && Number.isFinite(correctedY) && Number.isFinite(correctedZ)) { this.vehicleManager.setVehiclePosition(correctedX, correctedY, correctedZ); if (speedMPH > 20) { const speedReduction = 0.75 - (normalizedSpeed * 0.2); this.vehicleManager.setSpeed(vehicleSpeed * speedReduction); } } else { console.error("Invalid forcefield correction calculated:", { x: correctedX, y: correctedY, z: correctedZ }); } } } else { const targetYOnTrack = closestPoint.point.y + 0.5; if (Math.abs(vehiclePos.y - targetYOnTrack) > 0.01) { if (Number.isFinite(targetYOnTrack)) { this.vehicleManager.setVehiclePosition(undefined, targetYOnTrack, undefined); } else { console.warn("Invalid targetYOnTrack calculated within bounds:", targetYOnTrack); } } } if (this.trackGenerator?.finishLine) { const finishLine = this.trackGenerator.finishLine; const vehicleToFinish = new THREE.Vector3().subVectors( vehiclePosition, finishLine.position ); if (!finishLine.forward || !Number.isFinite(finishLine.forward.x)) { console.error("Invalid finishLine.forward vector:", finishLine.forward); return; } const projectionDistance = vehicleToFinish.dot(finishLine.forward); const projectedPoint = new THREE.Vector3().copy(finishLine.position) .addScaledVector(finishLine.forward, projectionDistance); const justCrossed = this.previousProjectionDistance !== null && this.previousProjectionDistance <= 0 && projectionDistance > 0 && this.vehicleManager.getSpeed() > 0; if (justCrossed) { if (!finishLine.right || !Number.isFinite(finishLine.right.x)) { console.error("Invalid finishLine.right vector:", finishLine.right); return; } const lateralOffset = new THREE.Vector3().copy(vehiclePosition) .sub(projectedPoint) .dot(finishLine.right); if (Math.abs(lateralOffset) < finishLine.width * 0.5) { if (this.gameManager) { const lapData = this.gameManager.handleLapCompletion(); if (lapData) { console.log("Race completed with data:", lapData); if(this.onRaceComplete) { this.onRaceComplete(lapData); } else { console.warn("onRaceComplete callback is missing in ThreeScene."); } } } else { console.warn("gameManager not available for lap completion."); } } } if (Number.isFinite(projectionDistance)) { this.previousProjectionDistance = projectionDistance; } else { console.warn("Invalid projectionDistance calculated, resetting previousProjectionDistance."); this.previousProjectionDistance = null; } } } detectDeviceType() { const userAgent = navigator.userAgent || navigator.vendor || window.opera; // Check for mobile devices if (/android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(userAgent.toLowerCase())) { // Determine if tablet based on screen size return window.innerWidth >= 768 ? 'tablet' : 'mobile'; } // If touch is supported but not mobile, probably tablet if ('ontouchstart' in window && window.innerWidth >= 768) { return 'tablet'; } // Default to desktop return 'desktop'; } // Removed showCompletionScreen method - logic moved to CompletionScreenManager // Removed showLeaderboard method - logic moved to CompletionScreenManager dispose() { if (this.animationFrameId) { cancelAnimationFrame(this.animationFrameId); this.animationFrameId = null; } // Completion Screen Manager cleanup removed if (this.gameManager) { this.gameManager.dispose(); this.gameManager.dispose(); this.gameManager = null; } if (this.visualEffectsManager) { this.visualEffectsManager.dispose(); this.visualEffectsManager = null; } if (this.characterManager) { this.characterManager.dispose(); this.characterManager = null; } if (this.trackGeneratorTool) { this.trackGeneratorTool.dispose(); this.trackGeneratorTool = null; } if (this.trackGenerator) { this.trackGenerator.dispose(); this.trackGenerator = null; } if (this.propulsionEffectManager) { this.propulsionEffectManager.meshes.forEach(mesh => { if(this.scene) { this.scene.remove(mesh); } }); this.propulsionEffectManager.dispose(); this.propulsionEffectManager = null; } if (this.exhaustEffectManager) { this.exhaustEffectManager.meshes.forEach(mesh => { if(this.scene) { this.scene.remove(mesh); } }); this.exhaustEffectManager.dispose(); this.exhaustEffectManager = null; } if (this.opponentVehicleManagers) { this.opponentVehicleManagers.forEach(manager => { manager.dispose(); }); this.opponentVehicleManagers = []; } if (this.opponentEffectManagers) { this.opponentEffectManagers.forEach(managers => { if (managers.propulsion) { managers.propulsion.dispose(); } if (managers.exhaust) { managers.exhaust.dispose(); } }); this.opponentEffectManagers = null; } if (this.debugVisualization) { this.debugVisualization.dispose(); this.debugVisualization = null; } window.removeEventListener('resize', this.handleResize); if (this.renderer && this.renderer.domElement) { this.renderer.domElement.removeEventListener('mousedown', this.handleMouseDown); this.renderer.domElement.removeEventListener('mouseup', this.handleMouseUp); this.renderer.domElement.removeEventListener('mousemove', this.handleMouseMove); this.renderer.domElement.removeEventListener('mouseleave', this.handleMouseUp); } this.disposeGameComponents(); this.objects.forEach(object => { if (object && this.scene) { this.scene.remove(object); this.disposeObject(object); } }); this.objects = []; if (this.lightShafts && this.scene) { this.scene.remove(this.lightShafts); this.disposeObject(this.lightShafts); this.lightShafts = null; } if (this.gridSegments) { this.gridSegments.forEach(grid => { if (grid && this.scene) { this.scene.remove(grid); } }); this.gridSegments = []; } if (this.scene) { this.scene.traverse(object => { this.disposeObject(object); }); this.scene = null; } this.disposeRenderer(); } updateVehiclePositionOnTrack(position) { if (this.trackGenerator && this.trackGenerator.trackCurve) { const closestPoint = this.trackGenerator.getClosestPointOnCurve(position); if (closestPoint) { this.vehicleManager.setVehiclePosition( position.x, closestPoint.point.y + 0.5, position.z ); } } } // Removed Integrated Completion Screen Methods (ensureSupabaseClient is now handled within CompletionScreenManager) // --- Mouse Control Handlers --- handleMouseDown = (event) => { this.isMouseDown = true; this.previousMousePosition.x = event.clientX; this.previousMousePosition.y = event.clientY; }; handleMouseUp = () => { this.isMouseDown = false; }; handleMouseMove = (event) => { if (!this.isMouseDown) return; const deltaX = event.clientX - this.previousMousePosition.x; const deltaY = event.clientY - this.previousMousePosition.y; // Sensitivity factor for mouse movement const sensitivity = 0.002; // Update camera offsets (Yaw = horizontal, Pitch = vertical) // Invert deltaY because moving mouse up should look up (decrease pitch) this.cameraYawOffset -= deltaX * sensitivity; this.cameraPitchOffset -= deltaY * sensitivity; // Clamp vertical pitch to avoid flipping upside down this.cameraPitchOffset = Math.max(-Math.PI / 2 + 0.1, Math.min(Math.PI / 2 - 0.1, this.cameraPitchOffset)); this.previousMousePosition.x = event.clientX; this.previousMousePosition.y = event.clientY; }; // --- End Mouse Control Handlers --- }