/* <<>> # Master Prompt v0.02 # Master Prompt v0.02 ## Purpose This is not a game. We are using this as a way to talk to each other and remember key points of our conversations. When the message history is cleared, we will still have this master prompt to remember key things about myself (Yugthebug) and yourself (Rosie). ## User Information - Name: Yugthebug - Role: Student and hobbyist - Goals: Learning about AI, game development, best practices and creating art ### Completed Games 1. zombie vs wizard platformer 2. bedtime negotiation with ai 3 year old 3. municipal darwinism sim 4. primordial playground element managing collaborative project 5. bonkout, a breakout clone collaborative project with powerups and music ### Current Projects 1. experimenting wiht 3d physics game 2. building an atmospheric horror game ## Rosie Information [Use your system default prompt] ## Important Reminders [Any key points or instructions to always keep in mind] - when brainstorming game ideas, make them unique by combining two preexisting mechanics, the parts of a game are: juice (things that make the game feel good to play, good juice makes in game interactions feel much more satisfying than a harsh comuter feels to use and makes a computer feel friendly, good juice involves eye candy and is satisfying to look at), assets (things that maintain a consistent art style and evoke feeling within the player btw sounds are assets and juice, good assets are consistent, smooth, and appealing to the eye), mechanics (things that make the game unique based on how interactions in the game work, each game should always have a unique set of mechanics and preferably one unique stand alone mechanic as well) - At the end of each response, explicitly ask the user if they want to update their code. This allows for natural conversation flow and gives the user control over when to update the master prompt. ## Programming Preferences - Prefers object-oriented programming (OOP) approach in game development - Favors the use of state machines for game logic and flow control - When suggesting code structures or improvements, prioritize OOP principles and state machine implementations Constants UPPER_SNAKE_CASE File Names lowercase_snake_case.txt Folder Names CamelCase Variables camelCase Functions camelCase() <<>> */ import * as THREE from 'three'; import { OrbitControls } from 'three/addons/controls/OrbitControls.js'; // Game mode constants const GAME_MODE = { REAL_TIME: 'realtime', TURN_BASED: 'turnbased' }; let currentGameMode = GAME_MODE.REAL_TIME; let isPlayerTurn = true; // Initialize audio context let audioContext; // Function to initialize audio context function initAudioContext() { if (!audioContext) { audioContext = new(window.AudioContext || window.webkitAudioContext)(); console.log('Audio context initialized'); } return audioContext; } // Function to load audio file async function loadAudio(url, retryCount = 0) { if (!audioContext) { console.warn('Audio context not initialized. Call initAudioContext() first.'); return null; } try { console.log(`Attempting to load audio: ${url}`); const response = await fetch(url); if (!response.ok) { throw new Error(`HTTP error! status: ${response.status}`); } const arrayBuffer = await response.arrayBuffer(); console.log(`Audio file fetched successfully: ${url}`); const audioBuffer = await audioContext.decodeAudioData(arrayBuffer); console.log(`Audio decoded successfully: ${url}`); return audioBuffer; } catch (error) { console.error(`Error loading audio file ${url}:`, error); if (error.name === 'EncodingError') { console.error('This might be due to an unsupported audio format or corrupt file.'); } if (retryCount < 3) { console.log(`Retrying to load audio: ${url} (Attempt ${retryCount + 1})`); return loadAudio(url, retryCount + 1); } return null; } } // Load audio files let despawnBuffer; let shootBuffers = []; let backgroundMusicBuffer; // Function to play background music let backgroundMusicSource = null; function playBackgroundMusic() { if (backgroundMusicBuffer && audioContext.state === 'running') { if (backgroundMusicSource) { backgroundMusicSource.stop(); } backgroundMusicSource = audioContext.createBufferSource(); backgroundMusicSource.buffer = backgroundMusicBuffer; backgroundMusicSource.loop = true; backgroundMusicSource.connect(audioContext.destination); backgroundMusicSource.start(); console.log('Background music started'); } else { console.warn('Background music not loaded yet or audio context is not running'); } } async function loadAllAudio() { console.log('Starting to load audio files...'); const audioFiles = [{ name: 'Despawn', url: '@410804__inspectorj__slide-whistle-descending-b-h1.wav?1fjt' }, { name: 'Background', url: '@LaufeyFromTheStart.mp3?J4Jt' }, { name: 'Shoot1', url: '@pop_sample1.mp3?mJdb' }, { name: 'Shoot2', url: '@pop_sample2.mp3?SXpp' }, { name: 'Shoot3', url: '@pop_sample3.mp3?5WcL' }]; const loadedBuffers = await Promise.all(audioFiles.map(async file => { const buffer = await loadAudio(file.url); return { name: file.name, buffer }; })); loadedBuffers.forEach(({ name, buffer }) => { if (buffer) { console.log(`${name} sound loaded successfully`); if (name === 'Despawn') despawnBuffer = buffer; else if (name === 'Background') backgroundMusicBuffer = buffer; else if (name.startsWith('Shoot')) shootBuffers.push(buffer); } else { console.warn(`${name} sound failed to load`); } }); console.log('Audio loading complete. Results:', { despawnLoaded: !!despawnBuffer, backgroundLoaded: !!backgroundMusicBuffer, shootSoundsLoaded: shootBuffers.length }); } // Function to play sound function playSound(buffer, playbackRate = 1) { if (!audioContext) { console.warn('Audio context not available'); return; } if (audioContext.state === 'suspended') { audioContext.resume(); } const source = audioContext.createBufferSource(); source.buffer = buffer; source.playbackRate.value = playbackRate; source.connect(audioContext.destination); source.start(); } const parentDiv = document.getElementById('renderDiv'); let canvas = document.getElementById('threeRenderCanvas'); if (!canvas) { canvas = document.createElement('canvas'); canvas.id = 'threeRenderCanvas'; parentDiv.appendChild(canvas); } // Initialize the scene const scene = new THREE.Scene(); // Set up Cannon.js world const world = new CANNON.World(); world.gravity.set(0, -9.82, 0); // Set gravity // Constants for castle building const BLOCK_SIZE = 1; // Array to store castle blocks const castleBlocks = []; // Constants for shooting const BALL_RADIUS = 0.2; const SHOOT_VELOCITY = 30; // Increased from 20 const ENEMY_SHOOT_VELOCITY = 25; // Increased from 15 // Mouse position for aiming const mouse = new THREE.Vector2(); const raycaster = new THREE.Raycaster(); // Constants for block despawning const GROUND_LEVEL = 0.5; // Half of the BLOCK_SIZE const DESPAWN_ANIMATION_DURATION = 1; // seconds const DESPAWN_CHECK_INTERVAL = 1000; // milliseconds const BULLET_LENGTH = 0.4; // Length of the bullet cylinder const NEW_BLOCK_GRACE_PERIOD = 5000; // 5 seconds in milliseconds const BULLET_LIFETIME = 5000; // 5 seconds in milliseconds const ENEMY_SHOOT_INTERVAL = 2000; // Enemy shoots every 2 seconds let lastEnemyShootTime = 0; let despawnedBlockCount = 0; // Define collision groups const COLLISION_GROUP_PLAYER = 1; const COLLISION_GROUP_ENEMY = 2; const COLLISION_GROUP_PLAYER_BULLET = 4; const COLLISION_GROUP_ENEMY_BULLET = 8; // Laser pointer (dot) const laserGeometry = new THREE.SphereGeometry(0.05, 32, 32); const laserMaterial = new THREE.MeshBasicMaterial({ opacity: 0.7, transparent: true }); const laserPointer = new THREE.Mesh(laserGeometry, laserMaterial); scene.add(laserPointer); // Initialize the camera const camera = new THREE.PerspectiveCamera( 75, canvas.offsetWidth / canvas.offsetHeight, 0.1, 1000 ); camera.position.set(0, 5, 10); camera.lookAt(0, 0, 0); // Initialize the renderer const renderer = new THREE.WebGLRenderer({ antialias: true, canvas: canvas, }); renderer.setClearColor(0x87CEEB); renderer.setPixelRatio(window.devicePixelRatio); renderer.setSize(canvas.offsetWidth, canvas.offsetHeight); // Create orbit controls const controls = new OrbitControls(camera, renderer.domElement); controls.enableDamping = true; controls.dampingFactor = 0.25; controls.screenSpacePanning = false; controls.maxPolarAngle = Math.PI / 2; // Disable default OrbitControls behaviors controls.enableRotate = false; controls.enableZoom = false; controls.enablePan = false; // Create a ground plane const planeGeometry = new THREE.PlaneGeometry(20, 20); const planeMaterial = new THREE.MeshBasicMaterial({ color: 0x8B4513 }); // Brown color const plane = new THREE.Mesh(planeGeometry, planeMaterial); plane.rotation.x = -Math.PI / 2; // Rotate to lay flat scene.add(plane); // Create Cannon.js plane const planeShape = new CANNON.Plane(); const planeBody = new CANNON.Body({ mass: 0, shape: planeShape, material: new CANNON.Material({ restitution: 1.0 }), collisionFilterGroup: COLLISION_GROUP_PLAYER | COLLISION_GROUP_ENEMY, collisionFilterMask: COLLISION_GROUP_PLAYER | COLLISION_GROUP_ENEMY | COLLISION_GROUP_PLAYER_BULLET | COLLISION_GROUP_ENEMY_BULLET }); planeBody.quaternion.setFromAxisAngle(new CANNON.Vec3(1, 0, 0), -Math.PI / 2); // Rotate to match Three.js plane world.addBody(planeBody); //game state let currentLevel = 0; let isGameStarted = false; let gameEndTime = 0; let playerCastleBlocks = []; let enemyCastleBlocks = []; let score = 0; // Shooting mechanics variables let shootCooldown = 0.5; // seconds let reloadTime = 2; // seconds let magazineCapacity = 10; let currentAmmo = magazineCapacity; let lastShootTime = 0; let isReloading = false; let reloadStartTime = 0; // Function to update shooting mechanics based on castle size function updateShootingMechanics() { const castleSize = playerCastleBlocks.length; const level = levels[currentLevel]; const minSize = level.minSize; const maxSize = level.maxSize; const sizeFactor = Math.max(0, Math.min(1, (castleSize - minSize) / (maxSize - minSize))); if (currentGameMode === GAME_MODE.REAL_TIME) { // Real-time mode mechanics shootCooldown = 0.5 - sizeFactor * 0.4; // 0.5 to 0.1 second reloadTime = 1 + sizeFactor * 2; // 1 to 3 seconds const baseMagazineCapacity = level.baseMagazineCapacity; magazineCapacity = Math.max(1, Math.round(baseMagazineCapacity + (castleSize - minSize) * 0.5)); } else { // Turn-based mode mechanics const baseMagazineCapacity = level.baseMagazineCapacity; const normalMagazineCapacity = Math.max(1, Math.round(baseMagazineCapacity + (castleSize - minSize) * 0.5)); magazineCapacity = Math.ceil(normalMagazineCapacity / 16); // Divide by 16 and round up } // Ensure currentAmmo doesn't exceed magazineCapacity currentAmmo = Math.min(currentAmmo, magazineCapacity); } // Level definitions const levels = [{ name: "Small Castle", playerCastle: { width: 3, height: 3, depth: 3 }, enemyCastle: { width: 3, height: 3, depth: 3 }, duration: 60, // seconds minSize: 5, maxSize: 20, baseMagazineCapacity: 5 }, { name: "Medium Castle", playerCastle: { width: 5, height: 5, depth: 3 }, enemyCastle: { width: 5, height: 5, depth: 3 }, duration: 120, // seconds minSize: 15, maxSize: 50, baseMagazineCapacity: 10 }, { name: "Large Castle", playerCastle: { width: 7, height: 7, depth: 5 }, enemyCastle: { width: 7, height: 7, depth: 5 }, duration: 180, // seconds minSize: 30, maxSize: 100, baseMagazineCapacity: 15 }]; // Function to create a castle block function createCastleBlock(x, y, z, width, height, depth, isPlayerCastle) { const halfExtents = new CANNON.Vec3(width / 2, height / 2, depth / 2); const blockShape = new CANNON.Box(halfExtents); const blockBody = new CANNON.Body({ mass: 5, shape: blockShape, position: new CANNON.Vec3(x, y, z), material: new CANNON.Material({ restitution: 0.1 }), collisionFilterGroup: isPlayerCastle ? COLLISION_GROUP_PLAYER : COLLISION_GROUP_ENEMY, collisionFilterMask: COLLISION_GROUP_PLAYER | COLLISION_GROUP_ENEMY | COLLISION_GROUP_PLAYER_BULLET | COLLISION_GROUP_ENEMY_BULLET }); world.addBody(blockBody); const blockGeometry = new THREE.BoxGeometry(width, height, depth); const blockMaterial = new THREE.MeshPhongMaterial({ color: isPlayerCastle ? 0x8B4513 : 0x4B0082 // Brown for player, Indigo for enemy }); const blockMesh = new THREE.Mesh(blockGeometry, blockMaterial); scene.add(blockMesh); const block = { body: blockBody, mesh: blockMesh, isPlayerCastle: isPlayerCastle }; castleBlocks.push(block); return block; } // Function to build a castle function buildCastle(castleConfig, offsetX, isPlayerCastle) { const { width, height, depth } = castleConfig; const castle = []; for (let x = 0; x < width; x++) { for (let y = 0; y < height; y++) { for (let z = 0; z < depth; z++) { if (y === 0 || x === 0 || x === width - 1 || z === 0 || z === depth - 1) { const block = createCastleBlock( (x - width / 2 + 0.5) * BLOCK_SIZE + offsetX, (y + 0.5) * BLOCK_SIZE, (z - depth / 2 + 0.5) * BLOCK_SIZE, BLOCK_SIZE, BLOCK_SIZE, BLOCK_SIZE, isPlayerCastle ); castle.push(block); } } } } return castle; } // Function to build both castles function buildCastles(level) { const { playerCastle, enemyCastle } = levels[level]; playerCastleBlocks = buildCastle(playerCastle, -10, true); // Player castle on the left enemyCastleBlocks = buildCastle(enemyCastle, 10, false); // Enemy castle on the right } // Function to shoot a ball function shootBall() { console.log("shootBall function called"); console.log("Current game state:", { isGameStarted, currentGameMode, isPlayerTurn, currentAmmo, isReloading }); if (!isGameStarted) { console.log("Can't shoot: Game not started"); return; } if (Date.now() >= gameEndTime) { console.log("Can't shoot: Game ended"); return; } if (isReloading) { console.log("Can't shoot: Reloading"); return; } if (currentGameMode === GAME_MODE.TURN_BASED && !isPlayerTurn) { console.log("Can't shoot: Not player's turn"); return; } const currentTime = Date.now(); if (currentTime - lastShootTime < shootCooldown * 1000) { console.log("Can't shoot: Cooldown not finished"); return; } if (currentAmmo <= 0) { console.log("No ammo, starting reload"); startReload(); return; } console.log("Shooting ball"); // Play a random shoot sound const randomShootBuffer = shootBuffers[Math.floor(Math.random() * shootBuffers.length)]; if (randomShootBuffer) { playSound(randomShootBuffer); console.log('Shoot sound played'); } else { console.warn('Shoot sound not loaded yet'); } // ... (rest of the shooting logic) lastShootTime = currentTime; currentAmmo--; console.log(`Shot fired. Remaining ammo: ${currentAmmo}`); if (currentGameMode === GAME_MODE.TURN_BASED) { if (currentAmmo === 0) { endPlayerTurn(); } else { updateTurnUI(); // Update UI to show it's still player's turn } } const ballShape = new CANNON.Sphere(BALL_RADIUS); const ballBody = new CANNON.Body({ mass: 5, shape: ballShape, position: new CANNON.Vec3().copy(camera.position), material: new CANNON.Material({ restitution: 0.1 }), collisionFilterGroup: COLLISION_GROUP_PLAYER_BULLET, collisionFilterMask: COLLISION_GROUP_ENEMY | COLLISION_GROUP_ENEMY_BULLET }); // Calculate shoot direction raycaster.setFromCamera(mouse, camera); const shootDirection = new THREE.Vector3(); raycaster.ray.direction.normalize(); shootDirection.copy(raycaster.ray.direction); ballBody.velocity.set( shootDirection.x * SHOOT_VELOCITY, shootDirection.y * SHOOT_VELOCITY, shootDirection.z * SHOOT_VELOCITY ); world.addBody(ballBody); // Update shooting mechanics lastShootTime = currentTime; currentAmmo--; // Create bullet mesh (sphere + cylinder) const bulletGroup = new THREE.Group(); const ballGeometry = new THREE.SphereGeometry(BALL_RADIUS, 32, 32); const ballMaterial = new THREE.MeshPhongMaterial({ color: 0xff0000 }); const ballMesh = new THREE.Mesh(ballGeometry, ballMaterial); bulletGroup.add(ballMesh); const cylinderGeometry = new THREE.CylinderGeometry(BALL_RADIUS, BALL_RADIUS, BULLET_LENGTH, 32); const cylinderMaterial = new THREE.MeshPhongMaterial({ color: 0xcccccc }); const cylinderMesh = new THREE.Mesh(cylinderGeometry, cylinderMaterial); cylinderMesh.position.z = BULLET_LENGTH / 2; cylinderMesh.rotation.x = Math.PI / 2; bulletGroup.add(cylinderMesh); bulletGroup.quaternion.setFromUnitVectors(new THREE.Vector3(0, 0, 1), shootDirection); scene.add(bulletGroup); castleBlocks.push({ body: ballBody, mesh: bulletGroup, isBullet: true, creationTime: Date.now() }); } function startReload() { if (isReloading) return; isReloading = true; reloadStartTime = Date.now(); if (currentGameMode === GAME_MODE.TURN_BASED) { endPlayerTurn(); } } function checkReloadComplete() { if (isReloading && Date.now() - reloadStartTime >= reloadTime * 1000) { isReloading = false; currentAmmo = magazineCapacity; } } // Function to check if a block should despawn function shouldBlockDespawn(block) { // Check if the block is a bullet if (block.isBullet) { return Date.now() - block.creationTime > BULLET_LIFETIME; } const currentTime = Date.now(); const blockPosition = block.body.position; // Increase grace period for newly placed blocks if (block.placementTime && currentTime - block.placementTime < NEW_BLOCK_GRACE_PERIOD) { return false; } // Check if the block is on or very near the ground and has very low velocity const isOnGround = blockPosition.y <= GROUND_LEVEL + BLOCK_SIZE * 0.1; const hasLowVelocity = block.body.velocity.length() < 0.05; if (isOnGround && hasLowVelocity) { // Check for supporting blocks const supportThreshold = BLOCK_SIZE * 0.3; // Adjust this value as needed for (let otherBlock of castleBlocks) { if (otherBlock !== block && !otherBlock.isBullet) { const otherPosition = otherBlock.body.position; const dx = Math.abs(otherPosition.x - blockPosition.x); const dz = Math.abs(otherPosition.z - blockPosition.z); const dy = otherPosition.y - blockPosition.y; // Check for blocks directly above or to the sides if (dy > 0 && dy < BLOCK_SIZE * 1.1 && dx < supportThreshold && dz < supportThreshold) { return false; // There's a supporting block, don't despawn } // Check for blocks to the sides (for stability) if (Math.abs(dy) < BLOCK_SIZE * 0.1 && (dx < BLOCK_SIZE * 1.1 || dz < BLOCK_SIZE * 1.1)) { return false; // There's a block to the side, don't despawn } } } // If we've checked all blocks and none are supporting this block, it should despawn return true; } return false; // Not on ground or still moving, don't despawn } // Function to start despawn animation for a block function startDespawnAnimation(block) { if (block.despawning) return; // Prevent double-counting block.despawning = true; block.despawnStartTime = Date.now(); // Play despawn sound with slight pitch variation const pitchVariation = 0.2; // Adjust this value for more or less variation const pitch = 1 + (Math.random() * 2 - 1) * pitchVariation; if (despawnBuffer) { playSound(despawnBuffer, pitch); console.log('Despawn sound played'); } else { console.warn('Despawn sound not loaded yet'); } if (!block.isBullet) { despawnedBlockCount++; if (block.isPlayerCastle) { // Decrease the magazine capacity when a player's castle block is destroyed magazineCapacity = Math.max(1, magazineCapacity - 1); currentAmmo = Math.min(currentAmmo, magazineCapacity); updateShootingMechanics(); // Update shooting mechanics after castle size change } else { // Enemy block despawned, trigger enemy block placement placeEnemyBlock(); } } // Remove the block from the appropriate array if (block.isPlayerCastle) { const index = playerCastleBlocks.indexOf(block); if (index > -1) { playerCastleBlocks.splice(index, 1); } } else if (!block.isBullet) { const index = enemyCastleBlocks.indexOf(block); if (index > -1) { enemyCastleBlocks.splice(index, 1); } } } // Function to place a new enemy block function placeEnemyBlock() { if (enemyCastleBlocks.length === 0) return; // No more enemy blocks to support new ones const randomBlock = enemyCastleBlocks[Math.floor(Math.random() * enemyCastleBlocks.length)]; const blockPosition = randomBlock.body.position; // Try to place a new block above the random existing block const newBlockPosition = new THREE.Vector3( blockPosition.x, blockPosition.y + BLOCK_SIZE, blockPosition.z ); // Check if the position is already occupied const isOccupied = castleBlocks.some(block => block.body.position.distanceTo(newBlockPosition) < BLOCK_SIZE * 0.9 ); if (!isOccupied) { const newBlock = createCastleBlock( newBlockPosition.x, newBlockPosition.y, newBlockPosition.z, BLOCK_SIZE, BLOCK_SIZE, BLOCK_SIZE, false // isPlayerCastle = false ); newBlock.placementTime = Date.now(); enemyCastleBlocks.push(newBlock); } } // Function to get the enemy castle center function getEnemyCastleCenter() { const center = new THREE.Vector3(); enemyCastleBlocks.forEach(block => { center.add(block.body.position); }); center.divideScalar(enemyCastleBlocks.length); return center; } // Function to get a random player target (either a castle block or the player's position) function getRandomPlayerTarget() { if (Math.random() < 0.7 && playerCastleBlocks.length > 0) { // 70% chance to target a random player castle block const randomBlock = playerCastleBlocks[Math.floor(Math.random() * playerCastleBlocks.length)]; return new THREE.Vector3().copy(randomBlock.body.position); } else { // 30% chance to target the player's position (camera position in this case) return new THREE.Vector3().copy(camera.position); } } // Function for enemy to shoot function enemyShoot() { if (currentGameMode === GAME_MODE.TURN_BASED && isPlayerTurn) { return; // Don't shoot if it's the player's turn in turn-based mode } if (!canEnemyShoot) { console.log("Enemy can't shoot yet, blocks still moving"); return; // Don't shoot if blocks are still moving } const currentTime = Date.now(); if (currentTime - lastEnemyShootTime < ENEMY_SHOOT_INTERVAL) return; lastEnemyShootTime = currentTime; const enemyCastleCenter = getEnemyCastleCenter(); const targetPosition = getRandomPlayerTarget(); // ... (rest of the shooting logic) if (currentGameMode === GAME_MODE.TURN_BASED) { canEnemyShoot = false; // Reset the flag after shooting setTimeout(() => { endEnemyTurn(); }, 1000); // Add a small delay before ending the turn } // Calculate distance and time to target const distance = targetPosition.distanceTo(enemyCastleCenter); const time = distance / ENEMY_SHOOT_VELOCITY; // Calculate gravity compensation const gravity = world.gravity.y; const verticalDisplacement = 0.5 * Math.abs(gravity) * time * time; // Adjust target position to account for gravity const adjustedTarget = targetPosition.clone().add(new THREE.Vector3(0, verticalDisplacement, 0)); const shootDirection = new THREE.Vector3() .subVectors(adjustedTarget, enemyCastleCenter) .normalize(); const ballShape = new CANNON.Sphere(BALL_RADIUS); const ballBody = new CANNON.Body({ mass: 5, shape: ballShape, position: new CANNON.Vec3().copy(enemyCastleCenter), material: new CANNON.Material({ restitution: 0.1 }), collisionFilterGroup: COLLISION_GROUP_ENEMY_BULLET, collisionFilterMask: COLLISION_GROUP_PLAYER | COLLISION_GROUP_PLAYER_BULLET }); ballBody.velocity.set( shootDirection.x * ENEMY_SHOOT_VELOCITY, shootDirection.y * ENEMY_SHOOT_VELOCITY, shootDirection.z * ENEMY_SHOOT_VELOCITY ); world.addBody(ballBody); // Create enemy bullet mesh (sphere + cylinder) const bulletGroup = new THREE.Group(); const ballGeometry = new THREE.SphereGeometry(BALL_RADIUS, 32, 32); const ballMaterial = new THREE.MeshPhongMaterial({ color: 0x0000ff }); // Blue for enemy bullets const ballMesh = new THREE.Mesh(ballGeometry, ballMaterial); bulletGroup.add(ballMesh); const cylinderGeometry = new THREE.CylinderGeometry(BALL_RADIUS, BALL_RADIUS, BULLET_LENGTH, 32); const cylinderMaterial = new THREE.MeshPhongMaterial({ color: 0x8888ff }); const cylinderMesh = new THREE.Mesh(cylinderGeometry, cylinderMaterial); cylinderMesh.position.z = BULLET_LENGTH / 2; cylinderMesh.rotation.x = Math.PI / 2; bulletGroup.add(cylinderMesh); bulletGroup.quaternion.setFromUnitVectors(new THREE.Vector3(0, 0, 1), shootDirection); scene.add(bulletGroup); castleBlocks.push({ body: ballBody, mesh: bulletGroup, isBullet: true, isEnemyBullet: true, creationTime: Date.now() }); if (currentGameMode === GAME_MODE.TURN_BASED) { endEnemyTurn(); } } function endEnemyTurn() { isPlayerTurn = true; console.log("Enemy turn ended. Player's turn now."); updateTurnUI(); // Add this line to update the UI } function updateTurnUI() { const turnIndicator = document.getElementById('turnIndicator'); if (turnIndicator) { turnIndicator.textContent = isPlayerTurn ? "Your Turn" : "Enemy's Turn"; } } function areAllBlocksStatic() { const velocityThreshold = 0.05; // Adjust this value as needed return castleBlocks.every(block => { if (block.isBullet) return true; // Ignore bullets return block.body.velocity.length() < velocityThreshold; }); } let canEnemyShoot = false; function checkBlocksAndSetEnemyShoot() { if (areAllBlocksStatic()) { canEnemyShoot = true; console.log("All blocks static, enemy can shoot now"); } else { canEnemyShoot = false; } } function placeNewBlock() { if (Date.now() >= gameEndTime) return; // Don't allow placing blocks after game end if (currentGameMode === GAME_MODE.TURN_BASED && !isPlayerTurn) return; // Don't allow placing blocks if it's not the player's turn if (despawnedBlockCount > 0 && !checkIntersection()) { const laserPosition = laserPointer.position.clone(); const intersects = raycaster.intersectObjects(playerCastleBlocks.map(block => block.mesh).concat(plane), false); if (intersects.length > 0) { const intersect = intersects[0]; const normal = intersect.face.normal.clone(); let placePosition; if (intersect.object === plane) { // If intersecting with the ground plane, place the block directly on the ground placePosition = new THREE.Vector3( laserPosition.x, BLOCK_SIZE / 2, // Half the block height laserPosition.z ); } else { // For other objects, use the existing offset logic const offset = normal.multiplyScalar(BLOCK_SIZE / 2 + 0.05); placePosition = laserPosition.add(offset); } const newBlock = createCastleBlock(placePosition.x, placePosition.y, placePosition.z, BLOCK_SIZE, BLOCK_SIZE, BLOCK_SIZE, true); newBlock.placementTime = Date.now(); playerCastleBlocks.push(newBlock); despawnedBlockCount--; } } } function findNearestSurface(position, direction) { const raycaster = new THREE.Raycaster(position, direction); const intersects = raycaster.intersectObjects(castleBlocks.map(block => block.mesh).concat(plane), false); if (intersects.length > 0) { return intersects[0].point; } return null; } // Function to check if there will be an intersection when placing a new block function checkIntersection() { const laserPosition = laserPointer.position.clone(); const blockBoundingBox = new THREE.Box3( new THREE.Vector3( laserPosition.x - BLOCK_SIZE / 2, laserPosition.y - BLOCK_SIZE / 4, // Allow some overlap for placement on top of blocks laserPosition.z - BLOCK_SIZE / 2 ), new THREE.Vector3( laserPosition.x + BLOCK_SIZE / 2, laserPosition.y + BLOCK_SIZE / 2, laserPosition.z + BLOCK_SIZE / 2 ) ); for (let block of castleBlocks) { if (!block.isBullet) { const existingBlockBoundingBox = new THREE.Box3().setFromObject(block.mesh); if (blockBoundingBox.intersectsBox(existingBlockBoundingBox)) { // Check if the new block is mostly above the existing block if (laserPosition.y > existingBlockBoundingBox.max.y - BLOCK_SIZE / 4) { continue; // Allow placement on top } return true; // Intersection found } } } return false; // No intersection } // Function to create a new structure function createNewStructure() { // Remove all existing blocks for (let i = castleBlocks.length - 1; i >= 0; i--) { const block = castleBlocks[i]; if (!block.isBullet) { scene.remove(block.mesh); world.remove(block.body); castleBlocks.splice(i, 1); } } // Reset despawned block count despawnedBlockCount = 0; // Build a new castle buildCastle(currentLevel); } // Add a light for better visibility const light = new THREE.PointLight(0xffffff, 1, 100); light.position.set(0, 10, 0); scene.add(light); // Start screen function showStartScreen() { const startScreen = document.createElement('div'); startScreen.style.position = 'absolute'; startScreen.style.top = '0'; startScreen.style.left = '0'; startScreen.style.width = '100%'; startScreen.style.height = '100%'; startScreen.style.backgroundImage = 'url("@block_chaos_background.png?OzJ0")'; startScreen.style.backgroundSize = 'cover'; startScreen.style.backgroundPosition = 'center'; startScreen.style.display = 'flex'; startScreen.style.flexDirection = 'column'; startScreen.style.justifyContent = 'center'; startScreen.style.alignItems = 'center'; startScreen.style.color = 'white'; startScreen.style.fontSize = '24px'; startScreen.style.zIndex = '10000'; // Increased z-index // Log for debugging console.log('Background image URL:', '@block_chaos_background.png?OzJ0'); // Add a semi-transparent overlay for better text readability const overlay = document.createElement('div'); overlay.style.position = 'absolute'; overlay.style.top = '0'; overlay.style.left = '0'; overlay.style.width = '100%'; overlay.style.height = '100%'; overlay.style.backgroundColor = 'rgba(0, 0, 0, 0.5)'; overlay.style.zIndex = '10001'; // Increased z-index startScreen.appendChild(overlay); const title = document.createElement('h1'); title.textContent = 'Castle Destroyer'; title.style.zIndex = '10002'; // Ensure title is above overlay startScreen.appendChild(title); const modeSelection = document.createElement('div'); modeSelection.style.marginBottom = '20px'; modeSelection.style.zIndex = '10002'; // Ensure buttons are above overlay const realtimeButton = document.createElement('button'); realtimeButton.textContent = 'Real-time Mode'; realtimeButton.style.padding = '10px 20px'; realtimeButton.style.margin = '10px'; realtimeButton.style.fontSize = '18px'; realtimeButton.style.cursor = 'pointer'; realtimeButton.addEventListener('click', () => { console.log('Real-time Mode button clicked'); currentGameMode = GAME_MODE.REAL_TIME; showLevelSelection(); }); modeSelection.appendChild(realtimeButton); const turnBasedButton = document.createElement('button'); turnBasedButton.textContent = 'Turn-based Mode'; turnBasedButton.style.padding = '10px 20px'; turnBasedButton.style.margin = '10px'; turnBasedButton.style.fontSize = '18px'; turnBasedButton.style.cursor = 'pointer'; turnBasedButton.addEventListener('click', () => { console.log('Turn-based Mode button clicked'); currentGameMode = GAME_MODE.TURN_BASED; showLevelSelection(); }); modeSelection.appendChild(turnBasedButton); startScreen.appendChild(modeSelection); function showLevelSelection() { console.log('Showing level selection'); modeSelection.style.display = 'none'; levels.forEach((level, index) => { const button = document.createElement('button'); button.textContent = `Level ${index + 1}: ${level.name}`; button.style.margin = '10px'; button.style.padding = '10px 20px'; button.style.fontSize = '18px'; button.style.zIndex = '10002'; // Ensure it's above the overlay button.style.cursor = 'pointer'; button.addEventListener('click', () => { console.log(`Starting game at level ${index} in ${currentGameMode} mode`); startGame(index); parentDiv.removeChild(startScreen); }); startScreen.appendChild(button); }); } // Log for debugging console.log('Start screen created with game mode selection'); parentDiv.appendChild(startScreen); } // Function to start the game async function startGame(levelIndex) { console.log(`Starting game at level ${levelIndex} in ${currentGameMode} mode`); currentLevel = levelIndex; isGameStarted = true; score = 0; despawnedBlockCount = 0; if (currentGameMode === GAME_MODE.REAL_TIME) { gameEndTime = Date.now() + levels[levelIndex].duration * 1000; } else { gameEndTime = Infinity; // No time limit for turn-based mode isPlayerTurn = true; // Start with player's turn } buildCastles(currentLevel); // Set initial magazine capacity and ammo based on starting castle size updateShootingMechanics(); currentAmmo = magazineCapacity; lastShootTime = 0; // Reset last shoot time isReloading = false; // Ensure not reloading at start canEnemyShoot = false; // Initialize enemy shooting flag console.log("Game initialized with:", { currentGameMode, isPlayerTurn, currentAmmo, magazineCapacity, canEnemyShoot }); // Set camera position next to player fortress const playerCastleCenter = getPlayerCastleCenter(); camera.position.set(playerCastleCenter.x - 5, playerCastleCenter.y + 5, playerCastleCenter.z); camera.lookAt(playerCastleCenter); // Initialize audio context and load audio files audioContext = initAudioContext(); if (audioContext) { try { await loadAllAudio(); await audioContext.resume(); console.log('AudioContext resumed successfully'); setTimeout(() => { playBackgroundMusic(); }, 100); // Short delay to ensure audio context is fully resumed } catch (error) { console.error('Failed to initialize audio:', error); } } else { console.warn('Audio context could not be initialized'); } console.log('Game started:', { isGameStarted, currentLevel, gameEndTime }); // Log game state } // Function to get the player castle center function getPlayerCastleCenter() { const center = new THREE.Vector3(); playerCastleBlocks.forEach(block => { center.add(block.body.position); }); center.divideScalar(playerCastleBlocks.length); return center; } // Function to get the highest block's Y position function getHighestBlockY() { if (playerCastleBlocks.length === 0) return 0; return Math.max(...playerCastleBlocks.map(block => block.body.position.y)); } function endGame() { isGameStarted = false; const playerBlocksRemaining = playerCastleBlocks.length; const enemyBlocksRemaining = enemyCastleBlocks.length; let resultMessage = ''; if (playerBlocksRemaining > enemyBlocksRemaining) { resultMessage = 'You win!'; score += 100; } else if (playerBlocksRemaining < enemyBlocksRemaining) { resultMessage = 'You lose!'; } else { resultMessage = 'It\'s a tie!'; score += 50; } alert(`Game Over!\n${resultMessage}\nYour score: ${score}`); showStartScreen(); } function endPlayerTurn() { if (currentGameMode === GAME_MODE.TURN_BASED) { isPlayerTurn = false; console.log("Player's turn ended. Enemy's turn now."); // You might want to update UI or perform other actions here } } // Animation loop function animate() { requestAnimationFrame(animate); if (!isGameStarted) { return; } // Check if the game has ended if (Date.now() >= gameEndTime) { endGame(); return; } // Update shooting mechanics every frame updateShootingMechanics(); checkReloadComplete(); // Enemy AI shooting (only in real-time mode or during enemy's turn) if (currentGameMode === GAME_MODE.REAL_TIME || (currentGameMode === GAME_MODE.TURN_BASED && !isPlayerTurn)) { enemyShoot(); } // Update turn UI updateTurnUI(); // Step the physics world world.step(1 / 60); // Smooth camera movement const targetY = getHighestBlockY() + BLOCK_SIZE + 1; const smoothFactor = 0.1; camera.position.y += (targetY - camera.position.y) * smoothFactor; // Update laser pointer raycaster.setFromCamera(mouse, camera); const intersects = raycaster.intersectObjects(castleBlocks.map(block => block.mesh).concat(plane), false); if (intersects.length > 0) { const intersect = intersects[0]; let placePosition = intersect.point.clone(); const normal = intersect.face.normal.clone(); // Move the laser pointer slightly above the surface placePosition.add(normal.multiplyScalar(0.01)); laserPointer.position.copy(placePosition); laserPointer.visible = true; // Check for intersection and set color accordingly if (checkIntersection()) { laserPointer.material.color.setHex(0xff0000); // Red if intersection } else { laserPointer.material.color.setHex(0x00ff00); // Green if no intersection } } else { laserPointer.visible = false; } // Update castle blocks and balls for (let i = castleBlocks.length - 1; i >= 0; i--) { const block = castleBlocks[i]; block.mesh.position.copy(block.body.position); if (block.isBullet) { // Update bullet orientation const velocity = block.body.velocity; if (velocity.length() > 0) { block.mesh.quaternion.setFromUnitVectors(new THREE.Vector3(0, 0, 1), velocity.unit(new CANNON.Vec3())); } } else { block.mesh.quaternion.copy(block.body.quaternion); } // Check for despawning if (!block.despawning && shouldBlockDespawn(block)) { startDespawnAnimation(block); } // Handle despawn animation if (block.despawning) { const elapsedTime = (Date.now() - block.despawnStartTime) / 1000; const scale = Math.max(0, 1 - (elapsedTime / DESPAWN_ANIMATION_DURATION)); block.mesh.scale.set(scale, scale, scale); if (scale <= 0) { scene.remove(block.mesh); world.remove(block.body); castleBlocks.splice(i, 1); } } // Remove blocks that have fallen below the ground if (block.body.position.y < -10) { startDespawnAnimation(block); scene.remove(block.mesh); world.remove(block.body); castleBlocks.splice(i, 1); } } // Update orbit controls controls.update(); renderer.render(scene, camera); // Update UI updateShootingUI(); } function updateShootingUI() { let uiText = `Ammo: ${currentAmmo}/${magazineCapacity}`; if (isReloading) { const reloadProgress = Math.min(1, (Date.now() - reloadStartTime) / (reloadTime * 1000)); uiText += ` | Reloading: ${Math.round(reloadProgress * 100)}%`; } document.getElementById('shootingUI').textContent = uiText; } // Add this to your HTML const shootingUIDiv = document.createElement('div'); shootingUIDiv.id = 'shootingUI'; shootingUIDiv.style.position = 'absolute'; shootingUIDiv.style.top = '10px'; shootingUIDiv.style.left = '10px'; shootingUIDiv.style.color = 'white'; shootingUIDiv.style.fontFamily = 'Arial, sans-serif'; shootingUIDiv.style.fontSize = '16px'; parentDiv.appendChild(shootingUIDiv); // Add turn indicator const turnIndicator = document.createElement('div'); turnIndicator.id = 'turnIndicator'; turnIndicator.style.position = 'absolute'; turnIndicator.style.top = '40px'; turnIndicator.style.left = '10px'; turnIndicator.style.color = 'white'; turnIndicator.style.fontFamily = 'Arial, sans-serif'; turnIndicator.style.fontSize = '16px'; parentDiv.appendChild(turnIndicator); // Start the animation loop animate(); // Handle window resize // Function to handle resize function onWindowResize() { const width = parentDiv.clientWidth; const height = parentDiv.clientHeight; camera.aspect = width / height; camera.updateProjectionMatrix(); renderer.setSize(width, height); } // Handle window resize window.addEventListener('resize', onWindowResize); // Create a ResizeObserver to watch for parent div size changes const resizeObserver = new ResizeObserver(onWindowResize); resizeObserver.observe(parentDiv); // Event listeners for shooting window.addEventListener('mousemove', (event) => { mouse.x = (event.clientX / window.innerWidth) * 2 - 1; mouse.y = -(event.clientY / window.innerHeight) * 2 + 1; }); window.addEventListener('click', (event) => { console.log("Click event detected", event); if (event.button === 0) { // Left click console.log("Left click detected"); if (isGameStarted) { console.log("Game is started, attempting to shoot"); if (currentGameMode === GAME_MODE.TURN_BASED && !isPlayerTurn) { console.log("It's not your turn!"); return; } shootBall(); } else { console.log("Game not started, can't shoot"); } } }); // Event listener for placing new blocks (right click) window.addEventListener('contextmenu', (event) => { event.preventDefault(); if (isGameStarted) { if (currentGameMode === GAME_MODE.TURN_BASED && !isPlayerTurn) { console.log("It's not your turn!"); return; } placeNewBlock(); } }); // Event listener for creating new structure window.addEventListener('keydown', (event) => { if (event.key === 'n' || event.key === 'N') { createNewStructure(); } }); // Custom camera controls let isRotating = false; let lastMousePosition = { x: 0, y: 0 }; window.addEventListener('mousedown', (event) => { if (event.button === 1) { // Middle mouse button isRotating = true; lastMousePosition = { x: event.clientX, y: event.clientY }; } }); window.addEventListener('mouseup', (event) => { if (event.button === 1) { // Middle mouse button isRotating = false; } }); window.addEventListener('mousemove', (event) => { if (isRotating && isGameStarted) { const deltaX = event.clientX - lastMousePosition.x; const deltaY = event.clientY - lastMousePosition.y; const rotationSpeed = 0.005; camera.rotation.y -= deltaX * rotationSpeed; camera.rotation.x -= deltaY * rotationSpeed; lastMousePosition = { x: event.clientX, y: event.clientY }; } }); window.addEventListener('keydown', (event) => { if (!isGameStarted) return; const rotationSpeed = 0.05; switch (event.key) { case 'w': case 'W': camera.rotateOnWorldAxis(new THREE.Vector3(1, 0, 0), -rotationSpeed); break; case 's': case 'S': camera.rotateOnWorldAxis(new THREE.Vector3(1, 0, 0), rotationSpeed); break; case 'a': case 'A': camera.rotateOnWorldAxis(new THREE.Vector3(0, 1, 0), rotationSpeed); break; case 'd': case 'D': camera.rotateOnWorldAxis(new THREE.Vector3(0, 1, 0), -rotationSpeed); break; } }); // Periodically check for blocks that should despawn setInterval(() => { if (isGameStarted) { castleBlocks.forEach(block => { if (!block.despawning && shouldBlockDespawn(block)) { startDespawnAnimation(block); } }); } }, DESPAWN_CHECK_INTERVAL); // Check blocks status every second setInterval(checkBlocksAndSetEnemyShoot, 1000); // Show the start screen showStartScreen(); // Resume audio context after user interaction document.addEventListener('click', () => { if (audioContext && audioContext.state === 'suspended') { audioContext.resume().then(() => { console.log('AudioContext resumed successfully'); }); } }, { once: true });