Classic Battlezone in Javascript

Sun, 01/21/2018 - 12:12

Coming Soon. Be sure and check back for details.

Click here to view the latest code in Github

Click here to play a live demo

I was playing the Atari Classic Battlezone on Mame last night and got inspired. This would be a fun game to make. I built a version of Battlezone in Flash back in like 2002 or 3-ish. But it didn't use actual 3D. It wasn't even the psuedo-3D used in Doom or Castle Wolfenstein. I faked the position by simply having the enemy tanks move left and right in relation to the player and the distance was a fake z-position. Being Flash the tanks and other aspects of the game were vector and it looked great ... It didn't play that great. But what are you gonna do?

battlezone in flash  

The New Version

The new version uses actual 3D. It uses vector drawings. I built a program to convert 3D models built in Anim8or into Javascript to create the models. The original Battlezone used vectors in part because of the type of CRT used and probably because of the hardware requirements of the time period. The style of CRT only needed to calculate each vertex whereas a typical CRT would need to raster each pixel.

When I was young my father bought us a Vectrex game console that incorporated the same type of CRT. If you turned the brightness of the screen all the way up you could see how all the vertexes were actually connected (even the faces that weren't meant to be). I guess the various edges that were meant to be displayed were might brighter...Not sure. I just remember that it looked ghostly.

My version is coming along nicely. It's currently playable in the sense that the player can:

  1. Drive around
  2. Be pursued by the enemy tank which has 5 current states of logic.
    1. patrol - wanders around looking for the player
    2. patrolrotate - rotates in one location looking for the player
    3. chase - actively chases the player
    4. lookchase - rotates in one location fixed on the player
    5. evade - actively avoid the player

battlezone enemy tank logic

The next step in its logic will be to add a collision avoidance (simple path algorithm around obstacles). The original appears to simply act as though obstacles don't exist until it runs into something. Then the enemy tank just kind of bumbles around the obstacle for a bit or it backs up and takes predefined route. This is fine and effective. But, it won't be hard to add a bit more logic to get around things.

February 4, 2018 - Added a command-line tool to render Anim8or models into Javascript based on my previous web-based tool. It scans the model directory and automatically converts any *.an8 files it finds.

February 5, 2018 - Added enemy tank explosions. I broke up the tank model in Anim8or into 5 sections then after repairing the broken faces I added some extra vertexes so I could crumple the pieces up. The code just throws the pieces up into the air randomly with some simple gravity and friction. The pieces bounce loosing momentum and settle. To complete the effect I added some tiny cubes as particles. It looks pretty good.

battlezone tank exploding test

February 21, 2018 - Reticle changes when the enemy is targeted. This needs work...but it "works".

February 22, 2018 - Added radar to the GUI also enemy tank now fires at player. It doesn't yet hurt the player but it does fire. The AI is still too stupid and is not aggressive enough...I'll fix that soon.

February 28, 2018

  • Player tank drives around automatically when game over as a demo.
  • Sound and other in game features encapsulated so they can run separately and be stopped as necessary. 
  • Added instructions.
  • Press "Enter" starts the game now.