The Tron Lightcycle Game in Any Browser

Greetings programs.

The game Jangaron is based on the lightcycle sequence of the 80s movie
Tron
which has inspired many computer games before. So why another one?

Because Jangaron runs in almost any browser without any plug-in,
so it can be played anytime, anywhere!
It is completely written in JavaScript and uses DHTML only.
You can even play Jangaron from your browser cache when
you are offline.
As far as I know, it is the first pure-DHTML game with fast, scalable 3D graphics,
not using the canvas element like
Canvascape,
but css border slants.
Even the Flash version
of the Tron lightcycle race shows only a 2D view of the game!

The game has been tested on Firefox 2, Internet Explorer 7, Safari 3.1, and
Opera 9, all on Windows. If you play Jangaron
successfully with any other browser or operating system or experience any problems,
please let me know. You can reach me by e-mail
or at my blog.

But action speaks louder than words, go ahead and try it yourself!

End of line.

In Jangaron, each player rides a colored lightcycle on the grid.
The lightcycles leave walls behind and can turn 90 degrees left or right.
The objective is to make your opponents hit a wall while avoiding them yourself.
You can accelerate and slow down within a configurable speed range.

All human players, called users, and some computer players (programs) have a
view port
that shows a 3D view from the perspective of their lightcycle.

The head-up display at the top of the screen shows
all player's names on a
background with their color, the number of wins (last survivor of a game and team wins)
and deaths (crashes).
The player's current speed, coordinates and direction are shown.

The players are grouped in teams. Players of the same
team have the same or at least a similar color. Teams can consist of a mix of users and
programs. Thus, users can play one-on-one, have support of program players, or play in
co-operative mode. Be prepared: When you crash, you are
transported to a so far program-controlled lightcycle
of your team immediately (if any such lightcycle is left) and can continue to try and
win the game!

The game is over when there is only one or no team
remaining or when the last user has
died. In the latter case, one of the remaining programs is chosen as the winner randomly.
If there is a survivor, her or his win count is increased.

Configure features of the game grid.

#{settings.showHelp ? 'Hide details' : 'Show details'}

If you switch on transparent lightcycle walls, you
have a bit more orientation and the 3D view looks more fancy.
However, there is a performance impact depending on your computers and browser.
Just try it out.

The high outer rim switch toggles whether the grey wall
which comprise the outer rim of the game grid are as high as lightcylce wall
(not checked) or infinetely high (checked).

You can add obstacles to the game grid to make the
game more challanging. If you check this option, you can enter the number of
obstacles to generate.

The target render frames per second allow you to fine-tune
the frame rate to your hardware. If the game runs jerky, it might be a good idea to
lower the value. If you have an up-to-date workstation and use a modern browser, you
may even be able to raise the value.

Finally, you can adjust the game grid size.
After leaving the input field, the game grid preview will be updated to give you
an impression of the dimensions.
The game does not slow down notably even with huge grid dimensions.
However, the height should not be too high, or it will take some time to meet
your opponents...

lightcycle walls are always transparent (slower)

infinitely high outer rim

generate obstacles:

Target render frames per second:

animate menu background grid (eats up CPU)

Size: x

Set up teams, players, and keys.

#{settings.showHelp ? 'Hide details' : 'Show details'}

Start by choosing one of the game modes
and select the overall number of players (users and computers).

Edit, add, and remove user or program players, enter names,
choose teams and colors.
You can only start the game if you chose at least two players and at least two different teams.

Every user has her or his view port, programs may be watched by checking the "View?" checkbox.
The total number of players is limited to six, the total number of view ports to four.

To assign keys for a user, click on or tab to the key column
and simply press the desired key.
You can also change the minimum and maximum speed of each lightcycle. Currently, programs always
go at the configured minimum speed.