The original Wolfenstein 3D used a technique called raycasting to create the pseudo-3D environment. This technique can also be used with JavaScript and canvas (see Canvex and Canvascape). However, when I set out to make this demo, the goal was to test some "real" 3D code I'd been working on and so this game does use raycasting. This creates a couple of nasty artifacts in the rendering, but all in all it should be playable.

The enemies are only partially implemented and don't do anything besides standing still and getting shot. There is also only the one level and no other weapons. The music is embedded MIDI, the sound effects are MP3s played via SoundManager2.

Check the blog posts for more details if you're interested.

This was one of my first experiments using JavaScript for more than "regular" web development and it had been lying around for way too long until I put it online last year (at which it point it just went crazy on Digg and other sites, for whatever reason.)

The game aims to recreate the Super Mario gameplay and parts of the first level of the classic NES game using only JavaScript. This means that all the sprites are created at runtime with tiny divs or, if possible, drawn on sprite-sized canvas elements. The sprite data is included in the code as encoded strings. The (admittedly horrible) MIDI tune is stored as base64 encoded data and embedded as a data: URI. The embedded sprites were also discussed in detail by John Resig.

Check the original blog post for links to a smaller version as well as music enabled versions.

And if you're looking for a not-so-tech-demoish game of Mario, be sure to also check out the more complete Super Mario clone by Guillermo Bruchmann.

More a showcase than an actual game, this Super Mario Kart clone lets you race forever and ever on a limited selection of Mario Kart courses against a few of the original Super Mario Kart characters (Mario, Luigi and Princess Peach).

The canvas element was used heavily in this game to rotate, stretch and position slices of the map to simulate perspective. The technique is similar to the "Mode 7" graphics mode that was used on the SNES to create this and other effects. A bit of embedded MIDI music is thrown in for good measure. A few more technical details are available in this blog post.

This is more a tech demo than a game, really, since there's no goal and you can just walk around the level and do.. well, nothing. That doesn't mean it's not cool, though. Canvex is a textured raycasting demo similar to Canvascape, but a bit more advanced. Where Canvascape was limited to walls aligned on an evenly spaced grid, Canvex has rooms of different shapes and different levels of elevation. This one also runs a lot better for me.

The game is dressed in Doom textures and there are even a few barrels and an animated Doom guy sprite thrown in for fun. Pretty cool, I say.

If you are interested in the technical details, Philip Taylor also made a page just for that.

This is not a complete game in any way. There is only one track and there's no lap count or anything, you can just race around forever, trying to outdo your opponents. It's still a cute game and it reminds a bit of the old Micro Machines games, which is of course a good thing. The graphics are also nice, as is the usual case with Peter Nederlof's games.

Unfortunately there's not much information available on the site, so any technical details will have to be found in the source code. The page does mention that he's using ExCanvas to make it work on IE, but that's about it.

The demo itself is pretty simple, you just walk around a pseudo-3D maze. There's a bit of gun-wobbling and some jumping thrown in as well. In the default mode, the walls are rendered as single colored surfaces but there's also a textured mode which, even if it's much slower, shows that there's potential for Wolfensteinish action.