Untitled

1. Set up the scene
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
const renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

// 2. Create the player (John Mercer as a humanoid box)
const geometry = new THREE.BoxGeometry(1, 2, 0.5); // A basic humanoid shape for John Mercer
const material = new THREE.MeshBasicMaterial({ color: 0xff0000 }); // Red for John Mercer
const player = new THREE.Mesh(geometry, material);
scene.add(player);

// 3. Create avatars (Na'vi-like enemies, represented as spheres)
const avatarGeometry = new THREE.SphereGeometry(0.5, 32, 32);
const avatarMaterial = new THREE.MeshBasicMaterial({ color: 0x0000ff });
let avatars = [];
for (let i = 0; i < 5; i++) {
  const avatar = new THREE.Mesh(avatarGeometry, avatarMaterial);
  avatar.position.set(Math.random() * 20 - 10, 1, Math.random() * 20 - 10);
  scene.add(avatar);
  avatars.push(avatar);
}

// 4. Environment - Add simple ground
const groundGeometry = new THREE.PlaneGeometry(500, 500);
const groundMaterial = new THREE.MeshBasicMaterial({ color: 0x228B22, side: THREE.DoubleSide });
const ground = new THREE.Mesh(groundGeometry, groundMaterial);
ground.rotation.x = Math.PI / -2; // Rotate to make it horizontal
scene.add(ground);

// 5. Add lighting
const light = new THREE.AmbientLight(0x404040);
scene.add(light);

// 6. Set up camera position
camera.position.set(0, 2, 5);
camera.lookAt(player.position);

// 7. Movement and shooting mechanics (John Mercer)
let moveSpeed = 0.2; // Faster speed for John Mercer, since he's the leader
let moveDirection = new THREE.Vector3(0, 0, 0);
let shootDirection = new THREE.Vector3(0, 0, -1);
let projectiles = [];

// 8. Keyboard controls for player movement
document.addEventListener('keydown', (event) => {
  switch (event.key) {
    case 'w': moveDirection.z = -moveSpeed; break;
    case 's': moveDirection.z = moveSpeed; break;
    case 'a': moveDirection.x = -moveSpeed; break;
    case 'd': moveDirection.x = moveSpeed; break;
    case ' ': shootProjectile(); break; // Space bar to shoot
  }
});

document.addEventListener('keyup', (event) => {
  if (['w', 's', 'a', 'd'].includes(event.key)) moveDirection.set(0, 0, 0); // Stop movement
});

// 9. Shooting mechanic (John Mercer's enhanced firepower)
function shootProjectile() {
  const projectileGeometry = new THREE.SphereGeometry(0.2, 8, 8);
  const projectileMaterial = new THREE.MeshBasicMaterial({ color: 0xff0000 }); // Red projectiles for John Mercer
  const projectile = new THREE.Mesh(projectileGeometry, projectileMaterial);
  
  projectile.position.set(player.position.x, player.position.y + 1, player.position.z); // Shoot from player position
  projectile.velocity = new THREE.Vector3(0, 0, -1).normalize().multiplyScalar(0.3); // Faster projectile for Mercer
  
  scene.add(projectile);
  projectiles.push(projectile);
}

// 10. Check for collisions
function checkCollisions() {
  projectiles.forEach((projectile, index) => {
    avatars.forEach((avatar, avatarIndex) => {
      const distance = projectile.position.distanceTo(avatar.position);
      if (distance < 1) { // Collision radius (projectile + avatar)
        scene.remove(avatar); // Remove avatar on hit
        avatars.splice(avatarIndex, 1); // Remove from avatars list
        scene.remove(projectile); // Remove projectile
        projectiles.splice(index, 1); // Remove from projectiles list
      }
    });
  });
}

// 11. Animation loop (John Mercer moving and shooting)
function animate() {
  requestAnimationFrame(animate);

  // Move the player (John Mercer)
  player.position.add(moveDirection);

  // Move projectiles
  projectiles.forEach(projectile => {
    projectile.position.add(projectile.velocity);
  });

  // Check for collisions
  checkCollisions();

  // Keep the camera focused on the player (John Mercer)
  camera.position.x = player.position.x + 3;
  camera.position.z = player.position.z + 5;
  camera.lookAt(player.position);

  // Render the scene
  renderer.render(scene, camera);
}

animate();