Difference between revisions of "Rot.js tutorial, part 1"

From RogueBasin
Jump to navigation Jump to search
Line 5: Line 5:
Our game is played within a web page; a rudimentary HTML file should be sufficient.
Our game is played within a web page; a rudimentary HTML file should be sufficient.


<div style="padding:5px; background-color:#eee; margin-bottom:2em;">
<syntaxhighlight lang="xml">
<syntaxhighlight lang="xml">
<!doctype html>
<!doctype html>
Line 18: Line 19:
</html>
</html>
</syntaxhighlight>
</syntaxhighlight>
</div>


We are going to put all the game code in one file, to maintain simplicity. When making larger games, it is far more useful to split the code across several files.
We are going to put all the game code in one file, to maintain simplicity. When making larger games, it is far more useful to split the code across several files.


<div style="padding:5px; background-color:#eee; margin-bottom:2em;">
<syntaxhighlight lang="javascript">
<syntaxhighlight lang="javascript">
var Game = {
var Game = {
Line 28: Line 31:
Game.init();
Game.init();
</syntaxhighlight>
</syntaxhighlight>
</div>
And that's all for part 1. The whole working code is available at [http://jsfiddle.net/rotjs/BmEwg/|jsfiddle.net].

Revision as of 13:21, 12 December 2012

This is the first part of a rot.js tutorial.

Setting up the development environment

Our game is played within a web page; a rudimentary HTML file should be sufficient.

<!doctype html>
<html>
    <head>
        <title>Ananas aus Caracas: rot.js tutorial game</title>
        <script src="https://raw.github.com/ondras/rot.js/master/rot.js"></script>
        <script src="/path/to/the/game.js"></script>
    </head>
    <body>
        <h1>Ananas aus Caracas</h1>
    </body>
</html>

We are going to put all the game code in one file, to maintain simplicity. When making larger games, it is far more useful to split the code across several files.

var Game = {
    init: function() {}
}

Game.init();

And that's all for part 1. The whole working code is available at [1].