Raycasting.js Engine v0.3 Tech Demo

Raycasting.js 

This is an implementation of the once-popular 3-D rendering technique known as raycasting which was famously featured in 1991's popular video game hit Wolfenstein 3D.

The engine has been written from scratch in pure JavaScript with no external dependencies other than that of HTML5's 2d canvas context to draw pixels on.

This personal project has more or less been my learning journey about early 90's 3d–or pseudo-3d rather–tech for the last couple of years. So the project has been growing with me, so to speak. Because this is the case, the code is not in its best shape as I mostly have been prototyping ideas and feature implementations and have not had the opportunity to undergo a major and a much needed refactoring. However such a refactor is in the backlog and is sure to gradually happen in future versions.

Key features include:

• AABB collision detection & resolution
• Custom occlusion-culling routine
• Free-look (perpective-incorrect, achieved via y-shearing)
• Player elevation
• Texture-mapped walls, floors & ceiling
• Alpha-blending
• Skybox rendering for outdoors
• Depth-based shading (fog effect)
• Mini-map display
• 2d static & animated sprites for in-game objects

Controls

• Use keys W and S on your keyboard to move forwards and backwards, respectively.
• Key ← rotates player counter-clockwise, and key → rotates player clockwise.
• Use keys A and D to strafe left and right, respectively.
• You may use either *, or the keys E and Q to raise and lower the player, respectively.
• Use keys ↑ and ↓ to look up and down, respectively.
• You may use either *, or SPACE to shoot.
• Use ENTER to open/close doors.
• You may also use the mouse* for free-look.

  * You should first click  on the canvas to activate mouse controls.

Please note that this is still heavily a WIP and regard it as a mere tech demo, as there is still no major gameplay loop implemented in.

Some of the visual and audio assets have been re-used from the original 1993 release of Doom.