WebGL Doom

WebGL Doom

...but not really, well at least not at the moment anyway. What we have here is a WebGL renderer for displaying Doom Levels loaded directly from the Shareware Wad file. This demo uses a GLBSP modified version of the original wad file can be downloaded from the official id software ftp to make it more WebGL/OpenGL friendly.

While Doom may not look very complicated by todays standards there are quite a few issues trying to render its data in an accellerated 3D enviroment, so there is plently of little hacks and bodges along the way. Which you can try and decipher from the spaghetti code at https://github.com/HeavyIndustries/webgldoom. At some point we plan to do a technical write up on how we got to this stage.

This demo uses the excellent jDataView.js binary file reader we can pull out all the map and texture information from the wad file then construct the data into a WebGL buffer. The rendering framework behind this demo is using our custom built WebGL engine he3d which we'll not go into, its not important to this demo, it just hides a lot of the html5/webgl/javascript gumpf away.

- 11th July 2013 Update:

"Suppose we should really push the latest stuff to github" Edition (TM)
The biggest change here is the addition of the 'world buffer', an offscreen render target that all the walls, flats, things and such are rendered into. This has some benfits such as pre-z calculation so we don't waste too much time doing work fancy pixels that you'll never see.

Supposedly should give a nice performance boost in theory but that doesn't seem to be the case, infact on Firefox at least it seems to have slowed it down even more. So while we are killing performance how about we go all the way and really butcher the framerate? Dynamic Lights and Screen Space Ambient Occlusion (SSAO)!

The Dynamic Lights are for missle projectiles only so far, but there is no reason why we couldn't detect certain THINGS that could emit light, like the slime barrels and the little light stalks that litter the levels. Currently the Dynamic Lights are hardlimited to 32.

SSAO is a subtle but awesome effect, you can toggle it using the . key, keep an eye on the edges and corners of the walls and floors. Yeah, told you it was subtle but now you've seen it, quite effective isn't it ;) Just ignore the huge hit to your FPS =P

Other bits
- Fixed(ish) projectiles getting stuck in the air.
- THINGS update stack now more efficient.
- THINGS now use a cylindrical billboarding style.
- Probably some other fixes.

It looks like a lot more was done as the diff is HUGE, this is pretty much just because I decided to get a bit stricter on the code style and virtually every line has been changed as a result =P

- 21st Feb 2013 Update:

- 8th Jan 2013 Update:

+ 4th Jan 2013 Update

+ 26th Dec 2012 Update

+ 24th Dec 2012 Update

The Demo

Yeah yeah yeah, enough with the technical nonsense, click on one of the links below to have a play around with it. Bare in mind that most of the maps don't render correctly and some may even cause errors and stop it from running but its still pretty fun to run around


If you have a recent version of Chrome you should have access to the Pointer Lock API, click on the main view port and you should get a small popup at the top of the screen asking you to allow mouse lock. This is a good thing...
If you don't have a fancy new version of Chrome, you can use the cursor keys to move your view around.

Other than that its your basic WASD style control scheme, you can use the Q and E keys to float up and down. Yeah yeah, Doom didn't have up and down, it didn't even have looking up and down but for the sake of this demo and to save my sanity while developing this, you can (in freecam mode).

**NEW** By default you walk around the map now, use the F key to toggle noclip / freecam mode (useful when you get stuck in a wall)

There are a few other buttons you can fiddle with too, if your GPU is halfway decent you can try maximising the viewport using ALT+RETURN, then if you are feeling really fruity, hit F11 for full screen browser mode.

You can also toggle some of the rendering settings using z,x,c,v,b,n,m.


We can't be held responsible for the quality of the code in this demo, we wrote it ourselves and that should be enough of a warning for you. Sorry if it burns down your cat or kicks your house, we didn't intend it to but these things just tend to happen.

With this being Doom and all, we are also not responsible if you go on a mass killing spree apparently that happens when you play video games.

Other Resources

The Original DOOM Source Code
Doom Wiki.org
Doom Code Review

Doom, Doom2 and Doom3 are trademarks of id Software. All game logos, graphics, textures and assets are copyright their respective owners. Please don't sue us, we just like your games/tech and want to mess around with them.