Battlezone Enhanced Edition

A love letter to the 1980 Atari classic, rebuilt from the ground up with modern web tech. Peer through the green phosphor glow of a virtual CRT monitor and command your wireframe tank across a hostile landscape — dodging enemy fire, hunting UFOs, and squaring off against multi-phase boss tanks that genuinely want you dead.

What Is This?

This is a first-person wireframe tank combat game that runs entirely in your browser. No installs, no build tools, no dependencies to wrangle. Just pure Three.js-powered 3D rendered through that unmistakable vector-green aesthetic that made the original arcade cabinet so iconic.

You'll fight through escalating waves of enemy tanks — light scouts that zip around the battlefield, heavily armoured brutes that absorb punishment, and the occasional UFO that darts across the sky worth a hefty point bonus if you can land the shot. Every five waves, a boss tank rolls in with shields, dual turrets, and a talent for spawning minions when you least expect it.

The battlefield itself is scattered with geometric obstacles — pyramids, monoliths, blocks — giving you cover to duck behind while you line up your next shot. A radar sweep in the corner tracks everything moving out there, and the HUD keeps you honest about your ammo, health, and whatever power-up is currently keeping you alive.

Speaking of power-ups: shields, rapid fire, homing missiles, laser beams, speed boosts, health packs, score multipliers, and the crowd-favourite nuke that wipes the screen clean. They drop randomly and they change the flow of a fight fast.

The soundtrack is entirely procedural — synthesised bass lines and arpeggios generated in real-time through the Web Audio API. No audio files for the music, just oscillators and math. Sound effects are the same story: every cannon blast, explosion, and radar ping is built from scratch each time it plays.

Running the Game

The entire game is static HTML and JavaScript. You just need something to serve the files.

Using Python (quickest option):

cd battlezone2
python3 -m http.server 8090

Then open http://localhost:8090 in your browser.

Using Node:

npx serve .

Using any other static file server — anything that can serve index.html from the project root will work. The game loads Three.js and Howler.js from CDN, so you do need an internet connection on first load.

Once the title screen appears, click to lock your mouse pointer and you're in. WASD moves the tank, mouse aims the turret, left-click fires. Press Escape to pause, and check the settings menu if you want to tweak volume or sensitivity.

Controls

Movement — W/S to drive forward and back, A/D to rotate the tank body. Aiming — Move the mouse. The turret follows independently of the hull. Weapons — Left-click for your primary cannon, right-click for secondary weapons (missiles once you grab the power-up), and the number keys swap between available weapon types. Other — Escape pauses, M toggles music, and the settings screen lets you adjust audio levels and mouse sensitivity.

Tech Under the Hood

The rendering is Three.js with everything set to wireframe — no textures, no PBR materials, just edges and vertices the way the original designers intended. On top of that sits a CSS layer faking CRT curvature, scanlines, and that soft green phosphor bloom. The result looks surprisingly close to staring into an actual vector display.

Enemy AI runs on a proper state machine with idle, patrol, chase, attack, flank, and retreat states. Enemies evaluate their situation each frame — distance to player, health remaining, available cover — and transition between behaviours accordingly. Boss fights layer on top of that with multi-phase logic, shield management, and coordinated minion attacks.

The procedural audio system builds every sound from Web Audio API primitives. The music generator composes in real-time using scale patterns and note sequences, shifting tempo and intensity for boss encounters. It's surprisingly catchy for something that's technically just maths.

Project Structure

index.html          — Entry point, HUD markup, screen overlays
style.css           — CRT effects, retro styling, animations
src/
  main.js           — Game orchestrator, state management, collision detection
  engine.js         — Three.js setup, terrain generation, game loop
  player.js         — Tank controls, weapons, projectile physics
  enemies.js        — AI state machine, enemy variants, boss fights
  powerups.js       — Power-up system, explosion particles, visual effects
  audio.js          — Procedural sound synthesis, dynamic music
  ui.js             — HUD, radar, menus, message system

Repository

github.com/jonathanleahy/battle-zone

License

MIT